/* Squeeky Clean premium art direction — 30 Oct 2026.
   PROVISIONAL brand colours until owner-supplied logo / brand standards arrive.
   Designed to augment the stable v1 stylesheet, not replace it. */
:root {
  --navy: #092630;
  --deep: #051b23;
  --ink: #122234;
  --blue: #8bb7e9;
  --blue2: #4887d0;
  --paper: #f8f9fa;
}
body { background: #ffffff; }
::selection { background: #91b7e2; color: #06172a; }
.header { position: fixed; transition: background .28s ease, box-shadow .28s ease, border-color .28s ease; }
.header.is-scrolled {
  background: rgba(5, 27, 35, .97);
  box-shadow: 0 16px 35px rgba(0, 18, 24, .15);
  border-color: rgba(255,255,255,.06);
  -webkit-backdrop-filter: blur(16px);
  backdrop-filter: blur(16px);
}
.brand-symbol { filter: drop-shadow(0 0 8px rgba(137,231,235,.15)); }
.brand-text strong { letter-spacing: .095em; }
.hero { isolation: isolate; }
.hero-photo { background-position: center 53%; }
.hero-photo-shade { background: linear-gradient(90deg, #051b23 0%, rgba(5,27,35,.94) 30%, rgba(5,27,35,.47) 66%, rgba(5,27,35,.12) 100%), linear-gradient(0deg, rgba(5,18,23,.72), transparent 38%); }
.hero-water-glass { position: absolute; inset: 98px 0 0; z-index: 1; overflow: hidden; pointer-events: none; opacity: .55; }
.hero-water-glass span { position: absolute; width: 7px; height: 16px; left: 73%; top: 12%; background: radial-gradient(ellipse at 27% 19%, #fff9 0%, #b2d4fa6b 19%, #d5e6fa10 65%, transparent 80%); box-shadow: inset 1px 1px 3px #ebf4ff99, 0 1px 7px #6295d030; border: 1px solid #e4f1ff55; border-radius: 52% 52% 60% 60%; filter: blur(.15px); transform: rotate(12deg); animation: bead 10s ease-in-out 1 both; }
.hero-water-glass span:nth-child(2) { left: 84%; top: 38%; width: 11px; height: 25px; animation-delay: .45s; }
.hero-water-glass span:nth-child(3) { left: 63%; top: 64%; width: 5px; height: 12px; animation-delay: .22s; }
.hero-water-glass span:nth-child(4) { left: 92%; top: 9%; width: 4px; height: 8px; animation-delay: .8s; }
.hero-water-glass span:nth-child(5) { left: 76%; top: 82%; width: 7px; height: 16px; animation-delay: 1.1s; }
@keyframes bead { 0%{ transform: translateY(-12px) rotate(8deg); opacity: 0; } 14%{ opacity: .95; } 57%{transform:translateY(32px) rotate(11deg)} 98%{ transform:translateY(100px) scale(.8); opacity: 0; } 100%{opacity:0} }
.hero-subbrand { display:flex; align-items:center; gap:11px; color:#e5edf7; font-size:10px; letter-spacing:.22em; font-weight:800; margin:-13px 0 24px; }
.hero-subbrand i { width:3px; height:3px; background: var(--blue); border-radius:50%; }
.hero h1 { text-wrap: balance; }
.hero h1 em { text-shadow: 0 0 22px #85b4e91c; }
.hero-description { font-size:16px; max-width:500px; }
.hero-seal-wrap { transform: rotate(-7deg); }
.hero-seal { backdrop-filter:blur(4px); background: radial-gradient(ellipse at 32% 20%, #4c7cb269 0%, #0a2543b8 44%, #031c28e8 100%); box-shadow: 0 0 0 9px rgba(255,255,255,.045), 0 24px 80px rgba(0,19,26,.33), inset 0 0 55px rgba(177,240,247,.1); }
.seal-gloss { position:absolute; inset:13px; border-radius:50%; background:radial-gradient(ellipse at 20% 5%,rgba(255,255,255,.2),transparent 42%); z-index:1; pointer-events:none; }
.hero-seal-text strong { letter-spacing:-.075em; }
.hero-seal-text small { color:#a5c9f2; }
.hero-seal canvas { z-index:5; }
.motion-note { font-weight:700; letter-spacing:.14em; font-size:9px; }
.atelier-strip { background:#f6f8fa; border-bottom:1px solid #e2e6eb; }
.atelier-grid { display:grid; grid-template-columns: repeat(3,minmax(0,1fr)); padding: 24px 0; }
.atelier-grid > div { display:grid; grid-template-columns:42px 1fr; column-gap:13px; padding:6px 32px; border-left:1px solid #d9dfe5; }
.atelier-grid > div:first-child { padding-left:0; border-left:0; }
.atelier-symbol { grid-row:1 / span 2; font:600 12px/2.15 var(--font); color:#3b6697; letter-spacing:.07em; }
.atelier-grid strong { font-size:10px; letter-spacing:.17em; color:#192e47; }
.atelier-grid small { font-size:12px; color:#657281; padding-top:4px; }
.service-card { transition: box-shadow .3s ease, transform .3s ease, border-color .3s ease; }
.service-card:hover { box-shadow: 0 22px 55px rgba(12, 60, 66, .09); transform: translateY(-4px); }
.service-icon { color:#3168a6; }
.service-icon svg { width:55px; height:55px; fill:none; stroke:currentColor; stroke-width:1.65; stroke-linecap:round; stroke-linejoin:round; }
.visual-story-panel small { opacity: .78; }
.questions { background: #f4f6f9; border-top:1px solid #e7ebef; }
.questions-grid { display:grid; grid-template-columns: .87fr 1.13fr; gap:12%; align-items:start; }
.questions h2 { font-size:clamp(2.8rem,4.5vw,4.7rem); line-height:1.12; letter-spacing:-.065em; margin-bottom:20px; }
.questions h2 em { font-weight:500; color:#3f699a; }
.questions-grid>div>p:not(.eyebrow) { line-height:1.8; color:#6e7a88; max-width:280px; }
.questions-list { border-top:1px solid #d6dde5; }
.questions-list details { border-bottom:1px solid #d6dde5; }
.questions-list summary { list-style:none; display:flex; align-items:center; justify-content:space-between; padding:28px 2px; cursor:pointer; font-size:15px; font-weight:800; color:#172a40; gap:16px; }
.questions-list summary::-webkit-details-marker { display:none; }
.questions-list summary>span { color:#3367a3; font-size:25px; font-weight:400; transition:transform .2s; }
.questions-list details[open] summary>span { transform: rotate(45deg); }
.questions-list details p { margin:0 0 25px; color:#5c6a7b; line-height:1.85; font-size:14px; max-width:510px; }
.questions-list details a { color:#164c89; text-decoration:underline; text-underline-offset:3px; }
.mobile-action-bar { display:none; }
@media(max-width:1100px) {
  .atelier-grid > div { padding:6px 18px; }
  .hero-seal-wrap { margin-bottom:30px; }
}
@media(max-width:760px) {
  .hero-water-glass { inset:76px 0 0; opacity:.35; }
  .header.is-scrolled { background:#051b23; }
  .hero-photo-shade { background:linear-gradient(90deg,#061a22bc,#05132299),linear-gradient(0deg,#051b23 10%,#051b2360 80%); }
  .hero-subbrand { font-size:9px; gap:9px; margin:-9px 0 25px; }
  .atelier-grid { grid-template-columns:1fr; padding:15px 0; }
  .atelier-grid>div,.atelier-grid>div:first-child { border:0; padding:13px 0; grid-template-columns:33px 1fr; }
  .atelier-grid>div+div { border-top:1px solid #dbe1e8; }
  .atelier-grid strong { font-size:9px; }
  .questions-grid { grid-template-columns:1fr; gap:34px; }
  .questions h2 { font-size:clamp(2.7rem,8vw,3.8rem); }
  .questions-list summary { padding:22px 2px; }
  .mobile-action-bar { display:flex; position:fixed; z-index:30; left:12px; right:12px; bottom:calc(10px + env(safe-area-inset-bottom)); border-radius:12px; box-shadow:0 10px 35px #09192b3a; overflow:hidden; border:1px solid rgba(255,255,255,.28); }
  .mobile-action-bar a { flex:1; display:flex; align-items:center; justify-content:center; gap:8px; min-height:55px; color:#fff; background:#081c33; font-size:12px; font-weight:800; }
  .mobile-action-bar a+a { background:#86b2e4; color:#05172b; }
  footer { padding-bottom:85px; }
  .hero-seal-wrap { margin-bottom:0; }
}
@media(max-width:480px) {
  .hero-subbrand { letter-spacing:.13em; }
  .hero-seal { width:132px; height:132px; }
  .hero-seal canvas { pointer-events:none; }
  .atelier-grid small { font-size:11px; }
}
@media(prefers-reduced-motion:reduce) {
  .hero-water-glass, .hero-water-glass span { animation:none!important; display:none; }
  .header, .service-card, .questions-list summary>span { transition:none!important; }
  .hero-seal canvas { display:none; }
}
/* Preview refinements. Palette sampled visually from the verified public Bracken logo;
   these are website design tokens, not claimed official brand specification values. */
:root{--navy:#101d43;--deep:#0a1430;--ink:#17243c;--blue:#ffdb43;--blue2:#258bcb}
.preview-banner{position:relative;z-index:40;background:#ffdb43;color:#101d43;text-align:center;padding:8px 16px;font-size:10px;font-weight:800;letter-spacing:.1em;line-height:1.5}
.header{top:31px;background:#0a1430c9}.header.is-scrolled{top:0;background:#0a1430f5}
.brand-logo{width:54px;height:54px;object-fit:contain;background:#fff;border-radius:50%;padding:2px}
.hero-backdrop{background:radial-gradient(ellipse at 75% 45%,#174c81,transparent 60%),#0a1430}
.hero-photo-shade{background:linear-gradient(90deg,#0a1430 0%,#0a1430ef 32%,#0a143077 70%,#0a143033),linear-gradient(0deg,#0a1430,transparent 45%)}
.hero-seal-wrap{transform:none;align-self:center;margin:55px 0 0;flex-shrink:0;width:310px}
.hero-seal{width:310px;height:310px;background:#fff;border:0;border-radius:50%;box-shadow:0 0 0 12px #ffffff0a,0 26px 80px #0005;backdrop-filter:none}
.hero-seal:before,.seal-gloss{display:none}.hero-logo{width:94%;height:94%;object-fit:contain;border-radius:50%;animation:logo-reveal 1.6s ease-out both}
@keyframes logo-reveal{from{opacity:0;transform:scale(.93);filter:blur(6px)}to{opacity:1;transform:none;filter:none}}
.motion-note{transform:none;color:#fff;letter-spacing:.12em}
.hero-stock{font-size:10px;line-height:1.6;color:#b8c6da;margin:18px 0 -15px}
.btn-blue,.mobile-action-bar a+a,.care-card{background:#ffdb43;color:#101d43}.btn-blue:hover{background:#ffe678}
.eyebrow,.text-link,.service-no,.script-accent,.section-top h2 em,.care h2 em,.location h2 em,.questions h2 em{color:#23659c}
.hero .eyebrow,.last-cta .eyebrow{color:#c8e9ff}.hero-subbrand{color:#fff}.hero-photo{filter:saturate(.8)}
.care-media{min-height:410px}.care-media img{height:auto;min-height:360px;object-fit:cover}.photo-credit{font-size:10px;line-height:1.6;color:#52647c;margin:10px 0 0;max-width:210px}.care-card{bottom:-30px}
section[id],main[id]{scroll-margin-top:110px}summary:focus-visible{outline:3px solid #23659c;outline-offset:4px}
@media(min-width:761px){.menu-toggle{display:none!important}}
@media(max-width:1100px) and (min-width:761px){.hero-seal-wrap{width:230px}.hero-seal{width:230px;height:230px}.hero-copy{max-width:67%}}
@media(max-width:760px){.header{top:46px}.preview-banner{min-height:46px;display:flex;align-items:center;justify-content:center}.hero-inner{padding-top:125px;padding-bottom:94px;min-height:0;display:flex;flex-direction:column;align-items:stretch;gap:40px}.hero{min-height:0}.hero-copy{padding:0}.hero-seal-wrap{position:relative;right:auto;bottom:auto;margin:0 auto;width:190px;align-self:center}.hero-seal{width:190px;height:190px}.hero-bottom-inner{height:62px}.hero-photo-shade{background:linear-gradient(90deg,#0a1430eb,#0a1430a8),linear-gradient(0deg,#0a1430,transparent)}.nav-links{background:#101d43}.nav-links{display:flex}.js .nav-links{display:none}.js .nav-links.open{display:flex}.menu-toggle{display:none}.js .menu-toggle{display:flex}html:not(.js) .header{position:relative;height:auto;top:0}html:not(.js) .nav{flex-wrap:wrap;padding:15px 0}html:not(.js) .nav-links{position:static;flex-direction:row;flex-wrap:wrap;box-shadow:none;padding:18px 0 0;width:100%}html:not(.js) .hero-inner{padding-top:55px}.care-card{right:0}.hero h1{font-size:clamp(2.5rem,10.5vw,4.5rem)}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
.cta-water i{animation:none}

.error-page{background:#0a1430;color:#fff;min-height:100vh;display:grid;place-items:center;text-align:center;padding:24px}.error-page .eyebrow{justify-content:center}.error-page h1{font-size:clamp(3rem,6vw,6rem)}.error-page main>p:last-of-type{color:#c5d0dd;max-width:460px;margin:0 auto 28px;line-height:1.8}.error-actions{display:flex;gap:12px;justify-content:center;flex-wrap:wrap}