/* Local preview additions. The reference design lives in styles.css. */
[hidden]{display:none!important}
.rv{opacity:1;transform:none}
html{scroll-padding-top:115px}
.skip-link{position:fixed;top:-70px;left:20px;z-index:200;background:var(--paper);color:var(--ink);padding:10px 18px}
.skip-link:focus{top:10px}
a:focus-visible,button:focus-visible{outline:2px solid var(--brass-lt);outline-offset:6px}
.brand strong{text-transform:uppercase;font-size:22px;letter-spacing:.11em;white-space:nowrap}
a[href^="mailto:"]{text-transform:uppercase}
.hero .hero-veil{background:linear-gradient(100deg,rgba(18,22,28,.57) 0%,rgba(18,22,28,.34) 44%,rgba(18,22,28,.1) 100%)}
.hero .hero-bg{transform:scale(1.1);animation:atlas-drift 30s ease-in-out infinite alternate}
@keyframes atlas-drift{from{transform:scale(1.1)}to{transform:scale(1.15)}}
.hero .hero-copy{text-shadow:0 1px 14px rgba(0,0,0,.22)}
.hero .hero-actions{text-shadow:none}
.area-banners{display:flex;flex-direction:column;gap:42px}
.area-banner{border-bottom:1px solid var(--line-dark)}
.area-photos{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:2px;height:310px;overflow:hidden}
.area-photos.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.area-photo{position:relative;display:block;min-width:0;overflow:hidden;background:#252c30;color:#fff}
.area-photo::after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(0,0,0,.5))}
.area-photo img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.area-photo:hover img{transform:scale(1.045)}
.area-photo span{position:absolute;bottom:22px;left:24px;right:16px;z-index:2;color:#fff;font-size:10px;font-weight:600;letter-spacing:.2em;text-transform:uppercase}
.area-heading{display:grid;grid-template-columns:50px 1fr auto;gap:24px;align-items:baseline;padding:25px 0 30px}
.area-heading .idx{font-size:10px;color:var(--brass-lt);font-weight:600;letter-spacing:.2em}
.area-heading h3{font-family:'Cormorant Garamond',serif;font-size:clamp(27px,3.2vw,42px);font-weight:300;line-height:1.2}
.area-heading h3 a:hover{color:var(--brass-lt)}
.area-heading .state{font-size:10px;letter-spacing:.24em;text-transform:uppercase;color:#ffffff80}
.photo-credits{margin-top:32px;font-size:10px;line-height:1.8;color:#ffffff70}
.photo-credits summary{cursor:pointer;display:list-item;width:fit-content;text-decoration:underline;text-underline-offset:3px}
.photo-credits ul{list-style:none;margin-top:15px;display:grid;grid-template-columns:1fr 1fr;gap:8px 28px}
.photo-credits a{color:var(--brass-lt)}
.photo-credits a:hover{text-decoration:underline}
.brand small{font-size:8px;letter-spacing:.3em}
.menu-toggle{display:none}
.local-studio-link{position:fixed;z-index:90;right:20px;bottom:20px;padding:10px 18px;border:1px solid rgba(210,185,140,.5);border-radius:3px;background:rgba(18,22,28,.9);color:#f6eddf;font:600 11px 'Manrope',sans-serif;letter-spacing:.08em;box-shadow:0 3px 20px #0002;backdrop-filter:blur(12px)}
.local-studio-link:hover{color:#fff;background:#232932}
.form-status{font-size:13px;line-height:1.7;margin-top:22px;color:var(--body)}
.form-status.error{color:#a13232}
.form-confirmation{padding:34px 0 20px;max-width:600px;outline:none}
.form-confirmation h2{font:300 clamp(30px,3.4vw,44px)/1.18 'Cormorant Garamond',serif;margin:20px 0}
.form-confirmation p{font-size:16px;line-height:1.75;color:var(--muted);margin-bottom:26px}
button:disabled{opacity:.65;cursor:wait}
.preview-note{padding:20px 24px;border:1px solid var(--line);border-left:2px solid var(--brass);background:white;margin-bottom:28px;font-size:14px;line-height:1.7;color:var(--muted)}
nav.top,nav.top.scrolled{padding:21px 40px;gap:22px;background:var(--paper);color:var(--ink);border-bottom:1px solid var(--line);backdrop-filter:none}
nav.top .brand small{color:var(--brass-dk)}
nav.top ul{gap:20px;justify-content:flex-end}
nav.top ul a{font-size:9px;letter-spacing:.1em;color:#55564f;white-space:nowrap;font-weight:600}
nav.top ul a:hover{color:var(--brass-dk)}
nav.top ul a::after{background:var(--brass)}
nav.top .nav-right{gap:0;flex-shrink:0}
nav.top .nav-cta{display:block;background:var(--brass);border-color:var(--brass);padding:13px 18px;color:#fff;font-size:9px;letter-spacing:.1em;white-space:nowrap}
nav.top .nav-cta:hover{background:var(--brass-dk);border-color:var(--brass-dk)}
@media(max-width:1180px){
  nav.top,nav.top.scrolled{padding:18px 24px;gap:22px}
  nav.top ul{display:none}
  .menu-toggle{display:flex;flex-direction:column;gap:5px;margin-left:auto;min-width:44px;min-height:44px;align-items:center;justify-content:center;z-index:2}
  .menu-toggle span{height:1px;width:23px;background:currentColor;transition:transform .2s,opacity .2s}
  .menu-open{background:var(--paper)!important}
  .menu-open .menu-toggle span:nth-child(1){transform:translateY(6px) rotate(45deg)}
  .menu-open .menu-toggle span:nth-child(2){opacity:0}
  .menu-open .menu-toggle span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
  nav.top.menu-open ul{display:flex;position:absolute;top:100%;left:0;right:0;padding:24px;flex-direction:column;gap:20px;background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
  nav.top.menu-open ul a{display:block;font-size:12px;padding:8px 0}
  .contact-strip>div:last-child{text-align:left!important}
  .contact-strip .tel{white-space:normal;overflow-wrap:anywhere}
  .contact-strip .sub{text-align:left!important}
}
@media(max-width:620px){
  .photo-credits ul{grid-template-columns:1fr}
  .area-photos{height:200px}
  .area-photos.three{grid-template-columns:repeat(2,minmax(0,1fr));height:360px;grid-template-rows:1fr 1fr}
  .area-photos.three .area-photo:last-child{grid-column:span 2}
  .area-photo span{left:14px;bottom:16px;font-size:9px;letter-spacing:.12em}
  .area-heading{grid-template-columns:28px 1fr;gap:12px;padding:22px 0}
  .area-heading .state{grid-column:2}
  .brand strong{font-size:20px;letter-spacing:.08em}
  nav.top,nav.top.scrolled{gap:12px;padding:18px 22px}
  .nav-right{display:none}
  .hero-actions{gap:12px}
  .hero-actions .btn{width:100%;justify-content:center;padding:18px 20px;font-size:10px}
  .hero{padding-bottom:295px}
  .hero .lede{font-size:16px}
  .hero h1{font-size:clamp(38px,9.8vw,58px)}
  .stat-row-inner{padding:0 24px}
  .stat .k{font-size:8px;letter-spacing:.19em}
  .stat{min-height:106px;padding:22px 16px}
  .stat:first-child{padding-left:16px}
  .reason{padding:34px 28px}
  .f-actions .btn{padding:18px 20px;letter-spacing:.16em;font-size:10px}
  .local-studio-link{right:14px;bottom:14px;padding:9px 13px}
}
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .rv{opacity:1;transform:none}
}