/* Turner Custom Coatings: ACG Landing Page Template 2 (no VSL).
   Turner's red and black from turnercustomcoatings.com. Barlow Condensed for heads, Barlow for text. */
:root{
  --slab:#111315;--slab-2:#1A1D20;--line-dark:#2E3236;
  --paper:#F4F2EE;--paper-2:#EAE6DF;--line:#D9D3C8;--white:#FFFFFF;
  --ink:#16191C;--muted:#5D6166;--muted-dark:#A3A8AD;--on-dark:#F4F2EE;
  --red:#CC1C1C;--red-dark:#AF1A1A;--red-on-dark:#EC5B5B;
  --head:'Barlow Condensed','Helvetica Neue',Arial,sans-serif;
  --sans:'Barlow','Helvetica Neue',Arial,sans-serif;
  --radius:12px;
  /* Flake texture, drawn in CSS until Gary's photos arrive. */
  --flake:
    radial-gradient(circle at 20% 30%,rgba(204,28,28,.6) 0 1.6px,transparent 2.2px),
    radial-gradient(circle at 70% 60%,rgba(244,242,238,.45) 0 1.3px,transparent 1.9px),
    radial-gradient(circle at 40% 80%,rgba(120,128,136,.6) 0 2px,transparent 2.6px),
    radial-gradient(circle at 85% 15%,rgba(60,66,72,.9) 0 2.4px,transparent 3px);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto;}*{transition:none!important;}}
body{background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;}
a{color:inherit;}
img{display:block;max-width:100%;}
.wrap{max-width:1120px;margin:0 auto;padding:0 32px;}
@media(max-width:640px){.wrap{padding:0 16px;}}
h1,h2,h3{font-family:var(--head);font-weight:800;letter-spacing:-.005em;line-height:1.04;}
h1{font-size:clamp(2.3rem,5.4vw,4rem);}
h2{font-size:clamp(1.8rem,3.6vw,2.6rem);}
h3{font-size:1.15rem;line-height:1.25;letter-spacing:-.01em;}
.eyebrow{display:block;font-weight:700;font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;color:var(--red-dark);margin-bottom:14px;}
.dark .eyebrow{color:var(--red-on-dark);}
.pop{color:var(--red);}
.btn{display:inline-flex;align-items:center;justify-content:center;background:var(--red);color:var(--white);font:700 1.04rem/1 var(--sans);padding:17px 30px;border-radius:10px;border:0;cursor:pointer;text-decoration:none;transition:background .15s ease;}
.btn:hover{background:var(--red-dark);}
.btn:disabled{opacity:.6;cursor:default;}
.btn-full{width:100%;}
section{padding:88px 0;}
@media(max-width:640px){section{padding:60px 0;}}
.dark{background:var(--slab);color:var(--on-dark);}
.section-head{max-width:640px;margin-bottom:40px;}
.section-head p{color:var(--muted);margin-top:12px;}
.dark .section-head p{color:var(--muted-dark);}

/* ===== Top: logo only, no nav ===== */
.top{background:var(--slab);padding:22px 0 0;}
.logo{display:inline-block;line-height:0;}
.logo img{height:72px;width:auto;}
@media(max-width:640px){.logo img{height:60px;}}
.funnel-brand{display:flex;justify-content:center;padding:26px 0 0;background:var(--slab);}

/* ===== Hero: headline, subhead, then the booking card ===== */
.hero{background:var(--slab);background-image:linear-gradient(180deg,rgba(17,19,21,.86),rgba(17,19,21,.97)),var(--flake);background-size:auto,34px 34px;color:var(--on-dark);padding:40px 0 88px;}
.hero-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:start;}
/* Let the day row scroll inside the card instead of widening the column. */
.hero-grid > *{min-width:0;}
.hero-copy{padding-top:28px;}
.hero-sub{font-size:1.15rem;color:var(--muted-dark);margin-top:20px;max-width:34ch;}
.trust{list-style:none;margin-top:30px;display:grid;gap:12px;}
.trust li{display:flex;gap:12px;align-items:flex-start;color:var(--on-dark);}
.trust li::before{content:"";flex:none;width:20px;height:20px;margin-top:3px;border-radius:50%;background:var(--red) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3 3 7-7' fill='none' stroke='%23FFFFFF' stroke-width='2.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/14px no-repeat;}
@media(max-width:900px){
  .hero{padding:24px 0 56px;}
  .hero-grid{grid-template-columns:1fr;gap:28px;}
  .hero-copy{padding-top:8px;text-align:center;}
  .hero-sub{margin-left:auto;margin-right:auto;font-size:1.05rem;}
  .trust{display:none;}
}

/* ===== Booking card ===== */
.book-card{background:var(--white);color:var(--ink);border-radius:16px;padding:28px;box-shadow:0 30px 60px -30px rgba(0,0,0,.6);scroll-margin-top:16px;}
@media(max-width:640px){.book-card{padding:20px 16px;}}
.book-card h2{font-size:1.5rem;margin-bottom:4px;}
.book-card .card-sub{color:var(--muted);font-size:.95rem;margin-bottom:20px;}
.label{display:block;font-weight:700;font-size:.85rem;margin-bottom:8px;}
.label small{font-weight:400;color:var(--muted);}
.pick-head{display:flex;justify-content:space-between;align-items:baseline;}
.month{font-size:.85rem;color:var(--muted);font-weight:600;}
.days{display:flex;gap:8px;overflow-x:auto;padding-bottom:6px;margin-bottom:14px;scrollbar-width:thin;}
.loading{color:var(--muted);font-size:.95rem;padding:10px 0;}
.day,.time{font:inherit;cursor:pointer;border:1.5px solid var(--line);background:var(--white);color:var(--ink);border-radius:10px;transition:border-color .12s ease,background .12s ease;}
.day{flex:none;width:60px;padding:8px 0 9px;text-align:center;}
.day small{display:block;font-size:.72rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:var(--muted);}
.day b{display:block;font-size:1.3rem;font-weight:800;line-height:1.1;}
.times{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:18px;}
.time{padding:11px 4px;font-weight:700;font-size:.95rem;}
.day:hover,.time:hover{border-color:var(--red-dark);}
.day[aria-pressed="true"],.time[aria-pressed="true"]{background:var(--slab);border-color:var(--slab);color:var(--white);}
.day[aria-pressed="true"] small{color:var(--muted-dark);}
.no-times{background:var(--paper);border-radius:10px;padding:14px 16px;font-size:.95rem;margin-bottom:16px;}
.no-times a{font-weight:700;}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px;}
.fields label{display:flex;flex-direction:column;gap:5px;font-weight:600;font-size:.85rem;}
.fields .full{grid-column:1/-1;}
.fields input,.fields select{font:inherit;font-weight:400;font-size:1rem;border:1.5px solid var(--line);border-radius:9px;padding:11px 12px;background:var(--white);color:var(--ink);width:100%;}
.fields input:focus,.fields select:focus{outline:none;border-color:var(--red-dark);box-shadow:0 0 0 3px rgba(204,28,28,.2);}
.fields [aria-invalid="true"]{border-color:#B3261E;}
@media(max-width:480px){.fields{grid-template-columns:1fr;}}
.consent{display:grid;gap:10px;margin-bottom:16px;}
.consent label{display:flex;gap:10px;align-items:flex-start;font-size:.78rem;line-height:1.45;color:var(--muted);cursor:pointer;}
.consent input{flex:none;width:18px;height:18px;margin-top:1px;accent-color:var(--red-dark);}
.hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0;}
.lf-error{background:#FDECEA;color:#8C1D18;border-radius:8px;padding:10px 12px;font-size:.92rem;margin-bottom:12px;}
.under{text-align:center;font-size:.9rem;color:var(--muted);margin-top:12px;}
.under a{font-weight:700;color:var(--ink);}
.legal{text-align:center;font-size:.78rem;color:var(--muted);margin-top:6px;}

/* ===== How it works ===== */
.steps{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:step;}
.steps li{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:28px;}
.steps li::before{counter-increment:step;content:counter(step);display:grid;place-items:center;width:40px;height:40px;border-radius:50%;background:var(--slab);color:var(--red-on-dark);font:800 1.1rem var(--head);margin-bottom:18px;}
.steps p{color:var(--muted);margin-top:8px;}
@media(max-width:800px){.steps{grid-template-columns:1fr;gap:14px;}.steps li{padding:22px;}}

/* ===== Our work ===== */
.floors{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.floor{background:var(--slab-2);border:1px solid var(--line-dark);border-radius:var(--radius);overflow:hidden;}
.floor-img{aspect-ratio:4/3;background-color:#2A2E32;background-image:var(--flake);background-size:26px 26px;position:relative;}
.floor-img::after{content:"Photo coming";position:absolute;left:10px;bottom:10px;font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted-dark);background:rgba(17,19,21,.75);padding:4px 8px;border-radius:6px;}
.floor-img.red{background-color:#5B1E1E;}
.floor-img.teal{background-color:#16484A;}
.floor-img.camo{background-color:#3A3F2A;}
.floor-img.marble{background-color:#6E6A63;}
.floor-img.photo{background:none;}
.floor-img.photo::after{display:none;}
.floor-img.photo img{width:100%;height:100%;object-fit:cover;}
.floor-body{padding:14px 16px 16px;}
.floor-body b{display:block;font-family:var(--head);font-size:1rem;}
.floor-body span{font-size:.88rem;color:var(--muted-dark);}
.prep{display:grid;grid-template-columns:repeat(3,1fr);gap:14px 32px;margin-top:44px;list-style:none;}
.prep li{border-top:1px solid var(--line-dark);padding-top:14px;}
.prep b{display:block;color:var(--on-dark);}
.prep span{font-size:.92rem;color:var(--muted-dark);}
@media(max-width:900px){.floors{grid-template-columns:repeat(2,1fr);}.prep{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.floors{grid-template-columns:1fr 1fr;gap:10px;}.prep{grid-template-columns:1fr;}}

/* ===== Reviews ===== */
.reviews{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;}
.review{background:var(--white);border:1px solid var(--line);border-radius:var(--radius);padding:26px;}
.stars{color:var(--red-dark);letter-spacing:2px;font-size:1rem;margin-bottom:10px;}
.review p{font-size:1rem;}
.review cite{display:block;font-style:normal;font-weight:700;font-size:.9rem;margin-top:14px;}
.review cite span{font-weight:400;color:var(--muted);}
.placeholder{color:var(--muted);font-style:italic;}
@media(max-width:860px){.reviews{grid-template-columns:1fr;}}

/* ===== CTA band ===== */
.cta-band{background:var(--red);color:var(--white);padding:64px 0;text-align:center;}
.cta-band h2{max-width:20ch;margin:0 auto;}
.cta-band p{margin:12px auto 26px;max-width:46ch;}
.cta-band .btn{background:var(--slab);color:var(--on-dark);}
.cta-band .btn:hover{background:#000;}

/* ===== FAQ ===== */
.faq{max-width:780px;}
.faq details{border-bottom:1px solid var(--line);}
.faq summary{cursor:pointer;list-style:none;padding:20px 40px 20px 0;font-weight:700;font-size:1.05rem;position:relative;}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::after{content:"+";position:absolute;right:4px;top:16px;font:400 1.6rem/1 var(--sans);color:var(--red-dark);}
.faq details[open] summary::after{content:"\2212";}
.faq details p{padding:0 0 20px;color:var(--muted);max-width:62ch;}

/* ===== Footer ===== */
.lp-foot{background:var(--slab);color:var(--muted-dark);font-size:.88rem;padding:28px 0;}
.lp-foot .wrap{display:flex;flex-wrap:wrap;gap:10px 24px;justify-content:space-between;align-items:center;}
.lp-foot-links{display:flex;flex-wrap:wrap;gap:8px 20px;}
.lp-foot a{color:var(--on-dark);text-decoration:none;}
.lp-foot a:hover{color:var(--red-on-dark);}

/* ===== Simple pages: thank-you, privacy, terms ===== */
.simple{background:var(--paper);padding:72px 0 88px;}
.simple .inner{max-width:720px;margin:0 auto;padding:0 32px;}
@media(max-width:640px){.simple .inner{padding:0 16px;}}
.simple h1{font-size:clamp(2rem,4.6vw,3rem);margin-bottom:16px;}
.simple h2{font-size:1.3rem;margin:36px 0 12px;}
.simple .lead{font-size:1.12rem;color:var(--muted);}
.simple ul{padding-left:20px;display:grid;gap:8px;}
.simple a{font-weight:700;}
.simple > h1{max-width:720px;margin:0 auto 16px;padding:0 32px;}
@media(max-width:640px){.simple > h1{padding:0 16px;}}
.funnel-brand{padding-bottom:22px;}
.legal-text{white-space:pre-line;max-width:720px;margin:0 auto;padding:0 32px;color:var(--ink);font-size:.98rem;}
@media(max-width:640px){.legal-text{padding:0 16px;}}
