/* NOGALES PAINT & SUPPLY LLC — Manual-guided interface edition.
   Primary red: 1788 C approximation sampled from the original identity PDF
   (native PDF vector #ED2136). Black 90% and white support the brand.
   Original raster logo files are kept intact. Mark.svg is a direct path
   extracted from the 2017 manual rather than an AI-recreated drawing.
*/
:root{
 --brand-red:#ed2136;--brand-red-dark:#c81d2c;--brand-ink:#252223;
 --brand-muted:#68676a;--brand-paper:#fff;--brand-soft:#f6f6f5;--brand-line:#e9e9e8;
 --red:#ed2136;--red-deep:#c81d2c;--ink:#252223;--slate:#424242;--bg:#fff;--soft:#f5f5f5;--line:#e8e8e8;
}
html{scroll-behavior:smooth;scroll-padding-top:88px}
body{background:#fff;color:var(--brand-ink)}
.demo-flag{background:#222;color:#eee;border-bottom:3px solid var(--brand-red)}
.pulse-dot{background:var(--brand-red)}
.sitehead{background:#fff;box-shadow:0 4px 22px #15131309;min-height:85px;border-bottom:1px solid #ededed}
.sitehead .identity{gap:12px}
.sitehead .identity img{width:63px;height:63px;object-fit:contain}
.sitehead .identity strong{font:800 13px/1.3 "Manrope",sans-serif;letter-spacing:.02em;color:#202020}
.sitehead .identity small{font-size:8px;letter-spacing:.17em;color:#8c8c8c}
.sitehead .headlinks a{color:#414141;letter-spacing:.04em}
.sitehead .headlinks a:hover{color:var(--brand-red)}
.sitehead .headaction{background:var(--brand-red);color:#fff}
.sitehead .headaction:hover{background:var(--brand-red-dark)}
.sitehead .headaction span{color:#fff}
.sitehead .head-private{color:#7d7d7d}
.btn,.headaction,.model-link,.shop-add{border-radius:0}
.btn-ink,.cart-header,.drawer-checkout,.shop-item-body .shop-add{background:var(--brand-red);color:#fff;border:1px solid var(--brand-red)}
.btn-ink:hover,.cart-header:hover,.drawer-checkout:hover,.shop-item-body .shop-add:hover{background:var(--brand-red-dark);border-color:var(--brand-red-dark)}
.btn-line{background:#fff;border:1px solid #c2c2c2}
.page-label,.eyebrow,.kicker,.intro-line span,.split-heading .kicker,.story-top .kicker{color:var(--brand-red)}
.accent-rule,.media-tag,.welcome-rule{background:var(--brand-red)}
/* Corporate Essential: white + brilliant red, no noisy gradients or faux paint-can chrome. */
body[data-page=essential] .corp-hero{min-height:640px;grid-template-columns:1.06fr .94fr;background:#fff}
body[data-page=essential] .corp-copy{padding:clamp(70px,8vw,120px) clamp(23px,5vw,90px) 73px clamp(23px,5vw,90px);background:#fff}
body[data-page=essential] .corp-copy .eyebrow{color:#515151}
body[data-page=essential] .corp-copy h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(52px,5.6vw,91px);font-weight:600;line-height:1.02;letter-spacing:-.067em;max-width:680px;margin:32px 0 29px}
body[data-page=essential] .corp-copy h1 em{color:var(--brand-red);font-style:normal}
body[data-page=essential] .corp-copy>p{color:#666;max-width:550px;font-size:16px}
body[data-page=essential] .corp-visual{overflow:hidden;isolation:isolate;background:
 radial-gradient(ellipse at 76% 46%,#ff5264 0,#ed2136 54%,#b5091e 100%);background-image:none}
body[data-page=essential] .corp-visual:before{content:"";position:absolute;inset:0;background:
 linear-gradient(125deg,#ed2136e0,#ed2136b0),url("https://images.unsplash.com/photo-1562259949-e8e7689d7828?auto=format&fit=crop&w=1200&q=85");
 background-size:cover;background-position:center;opacity:.85}
body[data-page=essential] .manual-corp-emblem{position:absolute;z-index:2;width:65%;height:85%;left:15%;top:8%;object-fit:contain;filter:brightness(0) invert(1);opacity:.88}
body[data-page=essential] .corp-visual-logo{position:absolute;z-index:3;left:28px;top:28px;padding:17px;background:#fff;box-shadow:0 10px 38px #55101125}
body[data-page=essential] .corp-visual-logo img{width:98px;height:90px;object-fit:contain}
body[data-page=essential] .corp-visual:after{content:"PANTONE 1788 C · BRAND EXPERIENCE";position:absolute;left:27px;bottom:26px;z-index:3;font:800 10px "Manrope",sans-serif;letter-spacing:.13em;color:white}
body[data-page=essential] .corp-section{background:#fff;padding-block:90px}
body[data-page=essential] #solutions{background:#f7f7f7!important}
body[data-page=essential] .corp-head h2,body[data-page=essential] .corp-contact h2{font-family:Georgia,"Times New Roman",serif;font-weight:600;letter-spacing:-.06em}
body[data-page=essential] .corp-categories{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
body[data-page=essential] .corp-category{min-height:270px;background:#fff;padding:24px;border:1px solid #e5e5e5;box-shadow:0 8px 18px #00000003}
body[data-page=essential] .corp-category .cat-number{color:var(--brand-red)}
body[data-page=essential] .corp-category .cat-graphic{width:146px;height:146px;right:-35px;top:-30px;background:#eee!important;box-shadow:none}
body[data-page=essential] .corp-category:nth-child(1) .cat-graphic{background:
 repeating-radial-gradient(circle at 50% 50%,#ed2136 0 12px,#fff 13px 20px)!important}
body[data-page=essential] .corp-category:nth-child(2) .cat-graphic{background:linear-gradient(133deg,#ed2136 0 50%,#efc1c6 50%)!important}
body[data-page=essential] .corp-category:nth-child(3) .cat-graphic{background:repeating-linear-gradient(40deg,#ddd 0 10px,#fff 10px 20px)!important}
body[data-page=essential] .corp-category:nth-child(4) .cat-graphic{background:repeating-linear-gradient(90deg,#ed2136 0 12px,#d1d1d1 12px 16px)!important}
body[data-page=essential] .corp-category h3{font:600 23px/1.15 Georgia,"Times New Roman",serif}
body[data-page=essential] .corp-callout{background:var(--brand-red);color:white;position:relative;overflow:hidden}
body[data-page=essential] .corp-callout:before{content:"";position:absolute;right:9%;top:-80px;width:340px;height:500px;background:url("../nogales-corporate/logo-manual-red.svg") center/contain no-repeat;filter:brightness(0) invert(1);opacity:.2}
body[data-page=essential] .corp-callout p{color:#fff9;max-width:580px}
body[data-page=essential] .corp-callout .btn-red{background:white;color:var(--brand-red);border:1px solid white;position:relative}
body[data-page=essential] .corp-contact-panel{background:#fff;box-shadow:0 18px 50px #0000000c}
body[data-page=essential] .corp-contact-panel input:focus,body[data-page=essential] .corp-contact-panel textarea:focus{outline-color:var(--brand-red)}
/* Automation: commercial red edition / one consistent business identity. */
body[data-page=automation] .auto-hero{padding-block:105px 94px;background:var(--brand-red);isolation:isolate;overflow:hidden;position:relative;min-height:555px}
body[data-page=automation] .auto-hero:after{content:"";position:absolute;right:-110px;top:-70px;width:450px;height:650px;border:0;box-shadow:none;background:url("../nogales-corporate/logo-manual-red.svg") center/contain no-repeat;filter:brightness(0) invert(1);opacity:.16;z-index:-1}
body[data-page=automation] .auto-hero .page-label{color:#fff9}
body[data-page=automation] .auto-hero h1{font-family:Georgia,"Times New Roman",serif;font-weight:600;font-size:clamp(52px,5.9vw,94px);line-height:1.04;letter-spacing:-.065em;max-width:1040px}
body[data-page=automation] .auto-hero h1 em{color:#ffdddd}
body[data-page=automation] .auto-hero p{font-size:15px;color:#fffdf4;max-width:720px}
body[data-page=automation] .auto-hero .btn-white{background:#fff;color:#171717}
body[data-page=automation] .auto-hint{color:#fffbd6}
body[data-page=automation] .manual-auto-stamp{display:none}
.manual-auto-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-bottom:1px solid #e4e4e4;border-top:1px solid #e4e4e4;background:#fff}
.manual-auto-steps>span{display:flex;align-items:center;justify-content:center;gap:16px;padding:25px 12px;border-right:1px solid #e4e4e4;font:800 12px "Manrope",sans-serif;letter-spacing:.01em;color:#343434}
.manual-auto-steps b{color:var(--brand-red);font-size:17px}
body[data-page=automation] .auto-workspace{padding-top:85px}
body[data-page=automation] .workspace-head h2{font-family:Georgia,"Times New Roman",serif;font-weight:600;letter-spacing:-.06em}
body[data-page=automation] .phone-demo{border:1px solid #dfdfdf;background:#f0f0f0;box-shadow:0 20px 45px #0000000b}
body[data-page=automation] .phone-bar{background:#efefef;color:#1c1c1c;border-bottom:3px solid var(--brand-red)}
body[data-page=automation] .phone-bar small{color:#676767}
body[data-page=automation] .phone-avatar{color:var(--brand-red);background:white;border:1px solid #ededed}
body[data-page=automation] .phone-demo-flag{background:var(--brand-red);border:0}
body[data-page=automation] .phone-messages{background-color:#f4f4f4;background-image:radial-gradient(#eee 1px,transparent 1px)}
body[data-page=automation] .chat-bubble{background:#fff;border:1px solid #ebebeb;box-shadow:none}
body[data-page=automation] .chat-bubble.mine{background:#ffe7eb;color:#461620;border-color:#ffced3}
body[data-page=automation] .phone-actions{background:#fff;border-top:1px solid #e5e5e5}
body[data-page=automation] .phone-actions button{border:1px solid var(--brand-red);color:var(--brand-red);background:#fff;border-radius:0}
body[data-page=automation] .phone-actions button:hover{background:#fff1f3}
body[data-page=automation] .phone-compose{background:white}
body[data-page=automation] .phone-compose button{background:var(--brand-red)}
body[data-page=automation] .monitor-head small{color:var(--brand-red)}
body[data-page=automation] .lead-symbol{background:#ffe6e9;color:var(--brand-red)}
body[data-page=automation] .lead-pill{background:#ffe7eb;color:#ac2632}
body[data-page=automation] .auto-bottom .btn-ink{background:var(--brand-red)}
body[data-page=automation] .corp-callout{background:#222;color:white}
body[data-page=automation] .corp-callout .btn-red{background:var(--brand-red);color:white}
/* Online Store: e-commerce clearly different from the quote-only catalogue. */
body[data-page=commerce] .shop-hero{background:#fff;grid-template-columns:1.03fr .97fr;min-height:600px}
body[data-page=commerce] .shop-hero-copy{padding:clamp(65px,7.5vw,119px) clamp(25px,5vw,90px)}
body[data-page=commerce] .shop-hero-copy h1{font:600 clamp(54px,6vw,100px)/1.04 Georgia,"Times New Roman",serif;letter-spacing:-.064em;color:#181818;margin:27px 0}
body[data-page=commerce] .shop-hero-copy h1 em{color:var(--brand-red)}
body[data-page=commerce] .shop-hero-copy p{color:#6b6b6b}
body[data-page=commerce] .shop-hero-image{background:#e9253e}
body[data-page=commerce] .shop-hero-image:before{background:linear-gradient(115deg,#e71933dc,#ce142bd0),url("https://images.unsplash.com/photo-1562259949-e8e7689d7828?auto=format&fit=crop&w=1300&q=85") center/cover;filter:none;inset:0}
body[data-page=commerce] .shop-hero-image:after{display:none}
body[data-page=commerce] .manual-commerce-emblem{z-index:2;position:absolute;right:4%;height:100%;width:64%;top:0;object-fit:contain;filter:brightness(0) invert(1);opacity:.89}
body[data-page=commerce] .shop-floating-label{background:#fff;left:24px;bottom:25px;padding:22px;box-shadow:0 9px 35px #4400002b}
body[data-page=commerce] .shop-floating-label strong{font:600 30px Georgia,serif}
.manual-shop-assurances{display:grid;grid-template-columns:repeat(4,1fr);border-block:1px solid #e5e5e5;background:#fff}
.manual-shop-assurances>span{padding:19px 15px;text-align:center;color:#555;font:800 10px "Manrope",sans-serif;letter-spacing:.08em;border-right:1px solid #eee}
body[data-page=commerce] .shop-top h2{font:600 clamp(37px,4.5vw,68px)/1.08 Georgia,serif}
.manual-shop-category{display:flex;gap:8px;flex-wrap:wrap;margin:26px 0 0}
.manual-shop-category button{border:1px solid #ddd;color:#373737;background:#fff;padding:10px 17px;font:800 11px "Manrope",sans-serif}
.manual-shop-category button.selected,.manual-shop-category button:hover{background:var(--brand-red);border-color:var(--brand-red);color:white}
body[data-page=commerce] .shop-item{border:1px solid #e6e6e6;box-shadow:0 12px 27px #00000007}
body[data-page=commerce] .shop-item-visual{background:linear-gradient(135deg,#fafafa,#eee)!important}
body[data-page=commerce] .shop-item-visual:after{color:var(--brand-red)}
body[data-page=commerce] .shop-item .can{border-radius:4px 4px 13px 13px}
body[data-page=commerce] .shop-item .can i{background:var(--accent,#ed2136)}
body[data-page=commerce] .shop-item-body small{color:var(--brand-red)}
body[data-page=commerce] .shop-item-body h3{font:600 21px/1.25 Georgia,serif}
body[data-page=commerce] .shop-item-body .shop-add{background:var(--brand-red)}
body[data-page=commerce] .checkout-form h2,body[data-page=commerce] .drawer-top strong{font:600 34px Georgia,serif}
body[data-page=commerce] .flow-options input{accent-color:var(--brand-red)}
body[data-page=commerce] .checkout-steps .active b{background:var(--brand-red)}
body[data-page=commerce] .checkout-summary{background:#f4f4f4}
body[data-page=commerce] .drawer-total{border-top:3px solid var(--brand-red)}
/* The proposal itself: showroom should resemble the visual boards shown to the client */
body[data-page=showroom] .show-hero{background:#fff;min-height:620px}
body[data-page=showroom] .hero-text h1{font:600 clamp(55px,5.5vw,92px)/1.05 Georgia,"Times New Roman",serif;letter-spacing:-.065em}
body[data-page=showroom] .hero-text h1 em{color:var(--brand-red)}
body[data-page=showroom] .hero-visual{background:var(--brand-red)}
body[data-page=showroom] .visual-a{background-image:linear-gradient(90deg,#ed2136ee,#b5162ccc),url("https://images.unsplash.com/photo-1562259949-e8e7689d7828?auto=format&fit=crop&w=1200&q=85");background-size:cover}
body[data-page=showroom] .visual-b,body[data-page=showroom] .red-disc{display:none}
body[data-page=showroom] .manual-show-mark{position:absolute;right:13%;top:9%;width:53%;height:85%;filter:brightness(0) invert(1);opacity:.87;object-fit:contain}
body[data-page=showroom] .hero-monogram{left:20px;top:20px}
body[data-page=showroom] .hero-monogram img{width:92px;height:80px}
body[data-page=showroom] .hero-visual-text{bottom:31px}
body[data-page=showroom] .models{gap:18px}
body[data-page=showroom] .model{box-shadow:0 13px 30px #0000000b}
body[data-page=showroom] .model-media{background:#fff;min-height:255px}
body[data-page=showroom] .model:nth-child(1) .model-media{background:#f4f4f4}
body[data-page=showroom] .model:nth-child(2) .model-media{background:#f4dde0}
body[data-page=showroom] .model:nth-child(3) .model-media{background:#edd5d8}
body[data-page=showroom] .model:nth-child(4) .model-media{background:#ed2136}
body[data-page=showroom] .model:nth-child(1) .essential-art{background:#fafafa}
body[data-page=showroom] .model:nth-child(1) .essential-art i:nth-child(2){background:#ed2136}
body[data-page=showroom] .premium-art{background:#fff}
body[data-page=showroom] .premium-art:before{background-image:linear-gradient(130deg,#f6f6f6ad,#ed21369c),url("https://images.unsplash.com/photo-1562259949-e8e7689d7828?auto=format&fit=crop&w=850&q=80")}
body[data-page=showroom] .premium-art:after{background:var(--brand-red)}
body[data-page=showroom] .automation-art{background:linear-gradient(140deg,#222,#ed2136)}
body[data-page=showroom] .chat-art span:nth-child(2){background:#ffe1e5}
body[data-page=showroom] .commerce-art{background:#ed2136}
body[data-page=showroom] .model-body{padding:24px 20px 20px}
body[data-page=showroom] .model h3{font:600 28px Georgia,serif}
body[data-page=showroom] .model h3 span{color:var(--brand-red)}
body[data-page=showroom] .model-link span{color:var(--brand-red)}
body[data-page=showroom] .model-features span{background:#f5f5f5;color:#5a5a5a}
body[data-page=showroom] .compare-section{background:#252525}
body[data-page=showroom] .comparison .price-row{background:#811020}
body[data-page=showroom] .story-top h2{font-family:Georgia,"Times New Roman",serif;font-weight:600}
body[data-page=showroom] .final-cta{background:var(--brand-red)}
/* Tiny namespaced refinements for pitch and admin without changing JS */
body.pitch-page .pitch-slide h1,body.pitch-page .pitch-slide h2{font-family:Georgia,"Times New Roman",serif;font-weight:600}
body.pitch-page .pitch-slide h1 em,body.pitch-page .pitch-slide h2 em{color:var(--brand-red)}
body.pitch-page .pitch-header{border-bottom:2px solid var(--brand-red)}
body.pitch-page .pitch-picture{background-image:linear-gradient(140deg,#ed21369f,#d51631dd),url("https://images.unsplash.com/photo-1562259949-e8e7689d7828?auto=format&fit=crop&w=1300&q=85")}
body.pitch-page .manual-pitch-mark{position:absolute;right:10%;top:5%;width:55%;height:89%;filter:brightness(0) invert(1);object-fit:contain;opacity:.65}
body.pitch-page .pitch-visual-two{background:linear-gradient(140deg,#f5f5f5,#e38c97)}
body.pitch-page .pitch-graphic-color span:nth-child(1){background:var(--brand-red)}
body.pitch-page .pitch-visual-chat{background:linear-gradient(135deg,#242424,#ed2136)}
body.pitch-page .pitch-visual-panel{background:linear-gradient(135deg,#ddd,#ed2136)}
body.pitch-page .pitch-visual-store{background:linear-gradient(135deg,#fafafa,#ed2136)}
body.admin-page .admin-sidebar{background:#222;border-top:4px solid var(--brand-red)}
body.admin-page .admin-tabs button.active{border-color:var(--brand-red);background:#3c2227}
body.admin-page .admin-live i{background:var(--brand-red)}
body.admin-page .admin-card-icon{background:#fff0f2;color:var(--brand-red)}
body.admin-page .admin-product .swatch{border:2px solid #fff;box-shadow:0 0 0 1px #ddd}
body.admin-page .admin-metric strong{color:#2a2a2a}
body.admin-page .admin-metric:first-child{border-top:3px solid var(--brand-red)}
/* All views: correct mobile layouts, no sideways overflow */
@media(max-width:1100px){
 body[data-page=essential] .corp-categories{grid-template-columns:repeat(2,minmax(0,1fr))}
 body[data-page=showroom] .model-media{min-height:200px}
}
@media(max-width:700px){
 .sitehead{min-height:67px}
 .sitehead .identity img{width:48px;height:46px}
 .sitehead .identity strong{font-size:11px}
 body[data-page=essential] .corp-hero,body[data-page=commerce] .shop-hero{display:flex;flex-direction:column}
 body[data-page=essential] .corp-copy,body[data-page=commerce] .shop-hero-copy{padding:50px 20px 37px}
 body[data-page=essential] .corp-copy h1,body[data-page=commerce] .shop-hero-copy h1{font-size:clamp(43px,10.6vw,64px)}
 body[data-page=essential] .corp-visual{min-height:330px}
 body[data-page=essential] .manual-corp-emblem{width:57%;left:24%}
 body[data-page=essential] .corp-category{min-height:195px;padding:18px}
 body[data-page=essential] .corp-category h3{font-size:20px}
 body[data-page=automation] .auto-hero{min-height:auto;padding:62px 22px 54px}
 body[data-page=automation] .auto-hero h1{font-size:clamp(44px,10vw,64px)}
 body[data-page=automation] .auto-hero:after{right:-180px;width:350px}
 .manual-auto-steps>span{font-size:9px;gap:5px;padding:15px 6px;flex-direction:column;text-align:center}
 .manual-auto-steps b{font-size:15px}
 body[data-page=commerce] .shop-hero-image{min-height:300px}
 body[data-page=commerce] .shop-floating-label strong{font-size:23px}
 .manual-shop-assurances{grid-template-columns:repeat(2,1fr)}
 .manual-shop-assurances>span{font-size:9px;padding:12px 6px}
 body[data-page=commerce] .shop-item-body h3{font-size:16px}
 body[data-page=showroom] .show-hero{min-height:0}
 body[data-page=showroom] .hero-text h1{font-size:clamp(45px,10.7vw,65px)}
 body[data-page=showroom] .model-media{min-height:170px}
 body[data-page=showroom] .model-body{padding:15px 12px}
 body[data-page=showroom] .model h3{font-size:22px}
 body.pitch-page .manual-pitch-mark{width:60%}
}
@media(max-width:380px){
 body[data-page=essential] .corp-categories{grid-template-columns:1fr}
 .manual-auto-steps>span{font-size:8px}
}
@media(prefers-reduced-motion:reduce){
 *,*:before,*:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}
}


/* The official SVG animates its paint stroke and circular lettering internally.
   Keep the image container still: preserve the exact layout and proportions.
   Optional 2% hover response is limited to links, never an endless loop. */
@media (hover:hover) and (prefers-reduced-motion:no-preference) {
  a.identity img[src$="logo-manual.svg"],
  a.brand img[src$="logo-manual.svg"],
  a.admin-mark img[src$="logo-manual.svg"] {
    transition:transform .24s ease-out;
    transform-origin:center;
  }
  a.identity:hover img[src$="logo-manual.svg"],
  a.brand:hover img[src$="logo-manual.svg"],
  a.admin-mark:hover img[src$="logo-manual.svg"] {
    transform:scale(1.02);
  }
}