/* Door Rev visual hardening — 2026-09-06
   Keeps Door Rev visually distinct from Thor Roofing and protects layouts at common laptop/tablet widths. */
:root{
  --navy:#163f43;
  --navy2:#0b2c30;
  --blue:#39747a;
  --gold:#c89a4b;
  --gold2:#ddb568;
  --gold-text:#8a641f;
  --ink:#172b2d;
  --muted:#647476;
  --soft:#f5f3ee;
  --line:#dcded9;
  --green:#2f735f;
  --shadow:0 18px 46px rgba(11,44,48,.12);
}
html,body{max-width:100%;overflow-x:hidden}
html{scroll-padding-top:110px}
body{background:#fffdfa;color:var(--ink)}
.top,.footer{background:#09282c}
.nav{background:rgba(255,253,250,.97)}
.links{gap:18px}
.links a{white-space:nowrap}
.btn-primary{background:var(--gold);color:#132326!important;border-color:var(--gold);box-shadow:0 8px 20px rgba(200,154,75,.18)}
.btn-primary:hover{background:var(--gold2)}
.btn-outline{background:#fffdfa;color:#18383b!important;border:1px solid #b9c7c5}
.hero{background:linear-gradient(120deg,#0b2c30,#163f43);overflow:hidden}
.heroGrid{grid-template-columns:minmax(0,46%) minmax(0,54%);min-height:610px;width:100%;max-width:none;padding-left:max(20px,calc((100vw - 1180px)/2));margin:0}
.heroCopy{min-width:0;max-width:620px;padding:72px 44px 68px 0;position:relative;z-index:3}
.heroCopy .actions .btn{min-width:190px}
.heroImg{min-width:0;min-height:610px;background-image:linear-gradient(90deg,rgba(11,44,48,.18),rgba(11,44,48,0) 32%),url('https://commons.wikimedia.org/wiki/Special:Redirect/file/Plaza_Hotel_corridor,_Sept_2017.jpg?width=1600');background-position:center center;background-size:cover;background-repeat:no-repeat;position:relative}
.heroImg:after{content:"Real hotel corridor reference • door concepts shown elsewhere on this site";right:18px;bottom:16px;max-width:300px;text-align:right;background:rgba(9,40,44,.82);color:#f7f3e8}
.eyebrow{color:var(--gold-text)}
.hero .eyebrow,.pageHero .eyebrow,.dark .eyebrow,.cta .eyebrow,.footer .eyebrow{color:var(--gold2)}
.hero h1 span{color:var(--gold2)}
.pathCard{background:#163f43}.pathCard:nth-child(2){background:#315e59}.pathCard:nth-child(3){background:#73583a}
.dark{background:#0b2c30}.metric{background:#17494d;border-color:#2e6467}.metric b{color:#e0bb76}
.compare.highlight,.priceCard.featured{border-color:var(--gold)}
.notice{background:#fbf3df;border-color:#ead19b;color:#5f481f}
.pageHero,.cta{background:linear-gradient(120deg,#0b2c30,#163f43)}
.footerBottom{border-color:#21494c}.sourceNote a{color:#356b70}
.form{scroll-margin-top:110px}

/* Keyboard, form and mobile-navigation hardening. */
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.skipLink{position:fixed;left:16px;top:10px;z-index:1000;transform:translateY(-180%);padding:11px 14px;border:3px solid var(--gold);border-radius:10px;background:#fffdfa;color:#18383b;font-weight:900;box-shadow:var(--shadow)}
.skipLink:focus{transform:translateY(0)}
.nav a[aria-current="page"]{text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:5px}
.mobileMenuButton{display:none;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:9px 12px;border:1px solid #b9c7c5;border-radius:10px;background:#fffdfa;color:#18383b;font:inherit;font-size:13px;font-weight:850;cursor:pointer}
.mobileMenuButton span:first-child{font-size:18px;line-height:1}
.mobileMenuPanel{display:none;position:absolute;left:0;right:0;top:100%;z-index:40;background:#fffdfa;border-top:1px solid var(--line);border-bottom:1px solid var(--line);box-shadow:0 18px 34px rgba(11,44,48,.14)}
.mobileMenuPanel[hidden]{display:none!important}
.mobileMenuPanel.open{display:block}
.mobileMenuInner{display:grid;grid-template-columns:1fr 1fr;gap:4px 18px;padding-top:15px;padding-bottom:18px}
.mobileMenuInner>a:not(.btn){padding:12px 4px;border-bottom:1px solid #ecebe6;font-weight:800}
.mobileMenuInner .btn{grid-column:1/-1;margin-top:8px;min-height:46px}
.formPrivacy{margin:0;color:var(--muted);font-size:12px;font-weight:500;line-height:1.5}
.formPrivacy a{color:var(--blue);font-weight:800;text-decoration:underline}
.hpField{position:absolute!important;left:-10000px!important;top:auto!important;width:1px!important;height:1px!important;overflow:hidden!important;opacity:0!important;pointer-events:none!important}
.formStatus:empty{display:none}
.formStatus{margin:0;padding:11px 13px;border:1px solid var(--line);border-radius:10px;font-size:13px;font-weight:700;line-height:1.45}
.formStatus.pending{background:#f3f6f5;color:#29484a;border-color:#cad7d4}
.formStatus.success{background:#edf7f2;color:#205c48;border-color:#b9d8cb}
.formStatus.fallback{background:#fbf3df;color:#5f481f;border-color:#ead19b}
.form button[disabled]{opacity:.68;cursor:wait}

/* Keep nav readable before the mobile menu breakpoint. */
@media(max-width:1160px){.links{gap:12px;font-size:13px}.logo img{width:205px}.navin{gap:14px}}
@media(max-width:1020px){.links a[href="/compliance"],.links a[href="/faq"]{display:none}}
@media(max-width:900px){
 .mobileMenuButton{display:inline-flex}
 .heroGrid{display:grid;grid-template-columns:1fr;width:100%;padding-left:0;min-height:0}
 .heroCopy{max-width:none;padding:58px max(24px,calc((100vw - 760px)/2));}
 .heroImg{min-height:430px;width:100%;background-position:center 40%}
 .heroImg:after{right:14px;bottom:12px}
 /* Keep the page-specific primary CTA authoritative. The persistent mobile control is a compact secondary call action, not a second competing Get Started bar. */
 .stickyMobile{left:auto!important;right:calc(12px + env(safe-area-inset-right));bottom:calc(12px + env(safe-area-inset-bottom));width:auto;background:transparent!important;border:0!important;padding:0!important;gap:0!important;box-shadow:none!important}
 .stickyMobile .btn-primary{display:none!important}
 .stickyMobile .btn-outline{flex:none!important;min-width:92px;min-height:46px;background:#fffdfa!important;box-shadow:0 10px 28px rgba(11,44,48,.2)}
 .footer{padding-bottom:58px}
}
@media(max-width:600px){
 .navin>.mobile{display:none}
 .mobileMenuInner{grid-template-columns:1fr}
 .mobileMenuInner .btn{grid-column:auto}
 .heroCopy{padding:46px 20px 42px}
 .heroCopy .actions{display:grid;grid-template-columns:1fr}
 .heroCopy .actions .btn{width:100%;min-width:0}
 .heroImg{min-height:330px}
 .hero h1,.pageHero h1{font-size:clamp(40px,13vw,54px)}
}
@media(prefers-reduced-motion:reduce){
 html{scroll-behavior:auto}
 *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
}

/* Local assets keep the main sales paths usable without third-party images. */
.twoPaths{grid-template-columns:repeat(2,minmax(0,1fr))}
.pathCard .eyebrow{color:#f1d298}
.heroImg.doorShowcase{background:radial-gradient(ellipse at center,#47736e,#173f43);display:flex;flex-direction:column;align-items:center;justify-content:center;padding:32px;gap:16px}
.heroImg.doorShowcase:after{display:none}
.showcaseDoors{display:flex;align-items:center;justify-content:center;gap:20px;width:100%}
.showcaseDoors img{width:44%;max-height:390px;object-fit:contain;filter:drop-shadow(0 16px 16px #09282c66)}
.doorShowcase p{color:#fff6e6;text-align:center;font-size:15px;line-height:1.6}
.doorShowcase small{color:#e0e8e3}
.visualGrid{grid-template-columns:repeat(auto-fit,minmax(220px,1fr))}
#mentor-pilot{scroll-margin-top:110px}
.formStatus textarea{display:block;width:100%;margin-top:14px;box-sizing:border-box;font:inherit;line-height:1.5}
.formStatus .actions{gap:8px}.formStatus .btn{font-size:13px;padding:10px}
.contactEmail{overflow-wrap:anywhere;font-size:clamp(18px,3vw,28px);font-weight:700}
@media(max-width:600px){.twoPaths{grid-template-columns:1fr}.heroImg.doorShowcase{min-height:0;padding:24px}.showcaseDoors img{max-height:260px}}