/* Linton Beauty College — site styles (loaded after tokens.css and base.css) */

/* Fonts: latin subsets only, preloaded in <head>; display=optional avoids layout shift */
@font-face{font-family:"Marcellus";font-style:normal;font-weight:400;font-display:optional;src:url(https://fonts.gstatic.com/s/marcellus/v14/wEO_EBrOk8hQLDvIAF81VvoK.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Figtree";font-style:normal;font-weight:300 900;font-display:optional;src:url(https://fonts.gstatic.com/s/figtree/v9/_Xms-HUzqDCFdgfMm4S9DQ.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

h1,h2,h3{font-weight:400;letter-spacing:0}
h3{font-family:var(--font-body);font-weight:600;letter-spacing:-.01em}
.btn{font-weight:600;border-radius:var(--radius)}

/* Header */
.brand img{height:44px;width:auto}
.brand span{font-family:var(--font-display);font-weight:400;font-size:1.15rem;letter-spacing:.01em}
.header-call{display:none}
@media(max-width:860px){
  .header-call{display:inline-flex;margin-left:auto;padding:.6em .9em;min-height:44px;font-size:var(--fs-sm)}
  .brand span{font-size:1rem}
}
@media(max-width:420px){.brand span{display:none}}

/* Hero: their floor, then a charcoal band with the headline */
.hero-lbc{background:var(--charcoal);color:#fff}
.hero-lbc .media-cover{height:clamp(200px,34vh,320px);object-position:50% 6%}
@media(min-width:760px){.hero-lbc .media-cover{height:clamp(320px,56vh,620px)}}
.hero-band{border-top:5px solid var(--accent);padding-block:clamp(1.75rem,4vw,3rem) clamp(2.25rem,5vw,3.5rem)}
.hero-band .container{display:grid;gap:var(--s-5);align-items:center}
@media(min-width:900px){.hero-band .container{grid-template-columns:1.35fr 1fr;gap:var(--s-7)}}
.hero-band h1{color:#fff;font-size:clamp(2.1rem,1.4rem + 3.2vw,4rem);line-height:1.05;margin:0;max-width:16ch}
.hero-band .lede{color:#e9e3ea;margin:0 0 var(--s-5)}
.btn-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.7)}
.btn-light:hover{background:#fff;color:var(--charcoal)}
.hero-band .btn-primary{background:#fff;color:var(--brand);box-shadow:none}
.hero-band .btn-primary:hover{filter:none;background:var(--mist)}

/* Programs */
.programs .list-rows h3{font-size:var(--fs-lg)}
.programs .list-rows li>span:last-child{text-align:right;line-height:1.4;color:var(--ink-2)}
.programs .list-rows li>span strong{display:block;color:var(--brand);font-weight:600;font-size:var(--fs-md)}
.facts{display:grid;gap:var(--s-4);margin:var(--s-6) 0 0;padding:0}
.facts dt{font-weight:600}
.facts dd{margin:.15em 0 0;color:var(--ink-2);max-width:48ch}
@media(max-width:560px){.programs .list-rows li{grid-template-columns:1fr}.programs .list-rows li>span:last-child{text-align:left;white-space:normal}}

/* Story: three dated photos — a real sequence */
.timeline{list-style:none;margin:var(--s-7) 0 0;padding:0;display:grid;gap:var(--s-6);grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr))}
.timeline figure{margin:0}
.timeline img{width:100%;aspect-ratio:5/4;object-fit:cover;border-radius:var(--radius)}
.timeline .when{display:block;font-family:var(--font-display);font-size:var(--fs-xl);color:var(--brand);margin:var(--s-4) 0 var(--s-2);padding-top:var(--s-3);border-top:2px solid var(--accent);line-height:1.1}
.timeline p{color:var(--ink-2);margin:0}
.story-close{margin-top:var(--s-8);display:grid;gap:var(--s-7);align-items:start}
@media(min-width:880px){.story-close{grid-template-columns:1.1fr 1fr}}
.pullquote{color:var(--brand);max-width:22ch;font-size:clamp(1.6rem,1.2rem + 1.6vw,2.4rem)}
.photo-note{font-size:var(--fs-xs);color:var(--ink-3);margin-top:var(--s-5)}

/* Salon */
.salon-grid{display:grid;gap:var(--s-7);align-items:start}
@media(min-width:880px){.salon-grid{grid-template-columns:1.2fr .8fr}}
.service-groups{display:grid;gap:var(--s-5);margin-top:var(--s-6)}
.service-groups h3{font-size:var(--fs-md);margin:0 0 var(--s-2);color:var(--brand)}
.service-groups p{margin:0;color:var(--ink-2)}
.salon-photo img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--radius)}
.salon-quote{margin:var(--s-6) 0 0;padding-left:var(--s-4);border-left:3px solid var(--accent)}
.salon-quote p{font-size:var(--fs-lg);color:var(--ink);margin:0}
.salon-quote footer{margin-top:var(--s-2);font-size:var(--fs-sm);color:var(--ink-2)}

/* Visit */
.closures{font-size:var(--fs-sm);color:var(--ink-2);max-width:52ch}
.hours{font-size:var(--fs-md)}

/* Footer */
.site-footer{background:var(--charcoal)}
.site-footer .brand span{color:#fff}