:root{--ink-900:#060708;--ink-850:#0a0b0d;--ink-800:#0e1013;--ink-750:#14171c;--ink-700:#1b1f26;--ink-600:#262b34;--line:rgba(255,255,255,0.08);--line-strong:rgba(255,255,255,0.14);--silver-50:#f4f6f8;--silver-100:#e6e9ee;--silver-200:#cfd4dc;--silver-300:#aab1bd;--silver-400:#868e9c;--silver-500:#626b7a;--text:#eef1f5;--text-soft:#b7bec9;--text-mute:#838b97;--glow:#8ab4d8;--glow-strong:#a9cdea;--metal:linear-gradient(135deg,#f2f4f7 0%,#c3c9d2 28%,#8b93a1 52%,#d7dce3 72%,#9aa2b0 100%);--metal-soft:linear-gradient(135deg,#dfe3e9 0%,#aeb6c2 50%,#d5dae1 100%);--panel:linear-gradient(160deg,rgba(30,35,43,0.9),rgba(14,16,19,0.9));--panel-hi:linear-gradient(160deg,rgba(40,46,56,0.95),rgba(18,21,26,0.95));--radius:16px;--radius-lg:24px;--shadow:0 24px 60px -20px rgba(0,0,0,0.7);--shadow-glow:0 0 0 1px var(--line),0 30px 80px -30px rgba(0,0,0,0.8);--ease:cubic-bezier(0.22,1,0.36,1);--font-head:"Sora","Plus Jakarta Sans",system-ui,sans-serif;--font-body:"Inter",system-ui,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased}body{margin:0;font-family:var(--font-body);color:var(--text);background:var(--ink-850);line-height:1.6;overflow-x:hidden}body::before{content:"";position:fixed;inset:0;z-index:-2;background:radial-gradient(900px 600px at 78% -8%,rgba(138,180,216,0.10),transparent 60%),radial-gradient(700px 500px at 8% 12%,rgba(120,130,150,0.08),transparent 55%),var(--ink-850)}body::after{content:"";position:fixed;inset:0;z-index:-2;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:64px 64px;mask-image:radial-gradient(circle at 50% 0%,black,transparent 78%);opacity:0.5}::selection{background:rgba(169,205,234,0.28);color:#fff}h1,h2,h3,h4{font-family:var(--font-head);font-weight:700;line-height:1.05;letter-spacing:-0.02em;margin:0}h1{font-size:clamp(2.6rem,6vw,4.6rem)}h2{font-size:clamp(2rem,4.2vw,3.2rem)}h3{font-size:clamp(1.25rem,2vw,1.6rem)}p{margin:0}a{color:inherit;text-decoration:none}.metal-text{background:var(--metal);-webkit-background-clip:text;background-clip:text;color:transparent;background-size:200% auto}.eyebrow{font-family:var(--font-head);font-size:0.78rem;font-weight:600;letter-spacing:0.24em;text-transform:uppercase;color:var(--silver-300);display:inline-flex;align-items:center;gap:0.6rem}.eyebrow::before{content:"";width:26px;height:1px;background:linear-gradient(90deg,var(--silver-300),transparent)}.text-soft{color:var(--text-soft)}.text-mute{color:var(--text-mute)}.lead{font-size:clamp(1.05rem,1.6vw,1.3rem);color:var(--text-soft)}.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}.section{padding:clamp(72px,11vw,140px) 0;position:relative}.section-sm{padding:clamp(48px,7vw,88px) 0}.center{text-align:center}.max-prose{max-width:640px}.mx-auto{margin-left:auto;margin-right:auto}.nav{position:fixed;top:0;left:0;right:0;z-index:60;transition:background 0.3s var(--ease),border-color 0.3s var(--ease),backdrop-filter 0.3s;border-bottom:1px solid transparent}.nav.scrolled{background:rgba(8,9,11,0.72);backdrop-filter:blur(18px) saturate(140%);border-bottom-color:var(--line)}.nav-inner{display:flex;align-items:center;justify-content:space-between;height:74px}.nav-logo{display:flex;align-items:center;gap:10px}.nav-mark{height:40px;width:auto;display:block}.wordmark{font-family:var(--font-head);font-weight:700;font-size:1.18rem;letter-spacing:-0.01em;color:#fff}.footer-logo{display:inline-flex;align-items:center;gap:10px}.footer-logo .nav-mark{height:38px}.nav-links{display:flex;align-items:center;gap:34px}.nav-link{font-size:0.92rem;font-weight:500;color:var(--text-soft);position:relative;padding:6px 0;transition:color 0.2s}.nav-link:hover,.nav-link.active{color:var(--text)}.nav-link::after{content:"";position:absolute;left:0;bottom:0;height:1px;width:0;background:var(--metal);transition:width 0.28s var(--ease)}.nav-link:hover::after,.nav-link.active::after{width:100%}.nav-cta{display:flex;align-items:center;gap:14px}.nav-toggle{display:none;background:none;border:0;color:var(--text);cursor:pointer;padding:8px}.mobile-menu{position:fixed;inset:74px 0 0;z-index:55;background:rgba(6,7,8,0.97);backdrop-filter:blur(20px);transform:translateY(-8px);opacity:0;pointer-events:none;transition:opacity 0.3s var(--ease),transform 0.3s var(--ease);display:flex;flex-direction:column;padding:32px 24px;gap:6px}.mobile-menu.open{opacity:1;transform:none;pointer-events:auto}.mobile-menu a:not(.btn){font-family:var(--font-head);font-size:1.4rem;font-weight:600;padding:14px 0;border-bottom:1px solid var(--line)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:0.55rem;font-family:var(--font-head);font-weight:600;font-size:0.95rem;padding:14px 26px;border-radius:12px;cursor:pointer;border:1px solid transparent;transition:transform 0.2s var(--ease),box-shadow 0.3s var(--ease),background 0.3s,border-color 0.3s;position:relative;overflow:hidden;white-space:nowrap}.btn:active{transform:translateY(1px)}.btn-metal{background:var(--metal);color:#0a0b0d;background-size:200% auto;box-shadow:0 10px 30px -10px rgba(180,190,205,0.4)}.btn-metal:hover{background-position:right center;transform:translateY(-2px);box-shadow:0 16px 40px -12px rgba(190,200,215,0.5)}.btn-metal::after{content:"";position:absolute;top:0;left:-120%;width:60%;height:100%;background:linear-gradient(100deg,transparent,rgba(255,255,255,0.7),transparent);transform:skewX(-18deg);transition:left 0.7s var(--ease)}.btn-metal:hover::after{left:140%}.btn-ghost{background:rgba(255,255,255,0.03);color:var(--text);border-color:var(--line-strong);backdrop-filter:blur(6px)}.btn-ghost:hover{background:rgba(255,255,255,0.08);border-color:var(--silver-400);transform:translateY(-2px)}.btn-lg{padding:17px 34px;font-size:1.02rem}.btn-block{width:100%}.glass{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-lg);backdrop-filter:blur(10px);box-shadow:var(--shadow-glow)}.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:30px;position:relative;overflow:hidden;transition:transform 0.4s var(--ease),border-color 0.4s,background 0.4s}.card::before{content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;background:linear-gradient(160deg,rgba(255,255,255,0.16),transparent 40%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;opacity:0;transition:opacity 0.4s}.card:hover{transform:translateY(-6px);border-color:var(--line-strong);background:var(--panel-hi)}.card:hover::before{opacity:1}.card-icon{width:52px;height:52px;border-radius:13px;display:grid;place-items:center;background:linear-gradient(160deg,var(--ink-600),var(--ink-750));border:1px solid var(--line-strong);margin-bottom:20px;color:var(--silver-100)}.card-icon svg{width:24px;height:24px}.pill{display:inline-flex;align-items:center;gap:8px;padding:7px 15px;border-radius:999px;background:rgba(255,255,255,0.04);border:1px solid var(--line);font-size:0.82rem;color:var(--text-soft);font-weight:500}.dot{width:7px;height:7px;border-radius:50%;background:#46d39a;box-shadow:0 0 10px #46d39a}.crest-rule{display:flex;align-items:center;justify-content:center;gap:14px;color:var(--silver-400)}.crest-rule span{height:1px;width:70px;background:linear-gradient(90deg,transparent,var(--silver-500))}.crest-rule span:last-child{background:linear-gradient(90deg,var(--silver-500),transparent)}.crest-mark{width:22px;height:16px}.stat-num{font-family:var(--font-head);font-weight:700;font-size:clamp(2.4rem,5vw,3.4rem);line-height:1}.stat-label{color:var(--text-mute);font-size:0.9rem;margin-top:8px}.hero{position:relative;padding-top:150px;padding-bottom:90px;overflow:hidden}.hero-canvas{position:absolute;inset:0;z-index:-1;opacity:0.55}.hero h1 span.metal-text{display:inline-block}.hero-glowline{position:absolute;left:0;right:0;bottom:0;height:1px;background:linear-gradient(90deg,transparent,var(--silver-400),transparent);opacity:0.5}.frame{border-radius:18px;border:1px solid var(--line-strong);overflow:hidden;background:var(--ink-800);box-shadow:var(--shadow)}.frame-bar{display:flex;align-items:center;gap:7px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--ink-750)}.frame-bar i{width:11px;height:11px;border-radius:50%;background:var(--ink-600);display:inline-block}.marquee{overflow:hidden;-webkit-mask:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}.marquee-track{display:flex;gap:56px;width:max-content;animation:marquee 34s linear infinite}.marquee-track span{font-family:var(--font-head);font-weight:600;color:var(--silver-400);font-size:1.05rem;white-space:nowrap;display:inline-flex;align-items:center;gap:14px}@keyframes marquee{to{transform:translateX(-50%)}}.step{position:relative;padding-left:66px}.step-num{position:absolute;left:0;top:0;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-family:var(--font-head);font-weight:700;background:var(--metal);color:#0a0b0d}.footer{border-top:1px solid var(--line);padding:72px 0 40px;background:linear-gradient(180deg,transparent,rgba(0,0,0,0.35))}.footer-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px}.footer h4{font-size:0.8rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--text-mute);margin-bottom:18px}.footer a{color:var(--text-soft);display:block;padding:6px 0;font-size:0.94rem;transition:color 0.2s}.footer a:hover{color:var(--text)}.footer-bottom{margin-top:56px;padding-top:26px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;color:var(--text-mute);font-size:0.85rem}.field{width:100%;padding:14px 16px;border-radius:12px;background:rgba(255,255,255,0.03);border:1px solid var(--line-strong);color:var(--text);font-family:var(--font-body);font-size:0.98rem;transition:border-color 0.2s,background 0.2s}.field:focus{outline:none;border-color:var(--glow);background:rgba(138,180,216,0.06)}.field::placeholder{color:var(--text-mute)}.label{display:block;font-size:0.82rem;font-weight:600;color:var(--text-soft);margin-bottom:8px}.reveal{opacity:0;transform:translateY(28px);transition:opacity 0.8s var(--ease),transform 0.8s var(--ease)}.reveal.in{opacity:1;transform:none}.reveal-d1{transition-delay:0.08s}.reveal-d2{transition-delay:0.16s}.reveal-d3{transition-delay:0.24s}.reveal-d4{transition-delay:0.32s}.grid{display:grid;gap:24px}.g-2{grid-template-columns:repeat(2,1fr)}.g-3{grid-template-columns:repeat(3,1fr)}.g-4{grid-template-columns:repeat(4,1fr)}.split{display:grid;grid-template-columns:1.05fr 1fr;gap:56px;align-items:center}.flex{display:flex}.items-center{align-items:center}.gap-sm{gap:12px}.gap{gap:20px}.wrap{flex-wrap:wrap}.mt-1{margin-top:12px}.mt-2{margin-top:20px}.mt-3{margin-top:32px}.mt-4{margin-top:48px}.mb-1{margin-bottom:12px}.mb-2{margin-bottom:20px}.mb-3{margin-bottom:32px}.mb-4{margin-bottom:48px}.divider{height:1px;background:var(--line);border:0}@media (max-width:960px){.footer-grid{grid-template-columns:1fr 1fr;gap:32px}.split{grid-template-columns:1fr;gap:40px}.g-4{grid-template-columns:repeat(2,1fr)}.g-3{grid-template-columns:1fr}}@media (max-width:720px){.nav-links{display:none}.nav-cta .btn-ghost{display:none}.nav-toggle{display:inline-flex}.g-2,.g-4{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr}.section{padding:72px 0}}@media (prefers-reduced-motion:reduce){*{animation-duration:0.001ms !important;transition-duration:0.001ms !important;scroll-behavior:auto}.reveal{opacity:1;transform:none}}.nav-login{display:inline-flex;align-items:center;gap:7px;font-family:var(--font-head);font-weight:600;font-size:0.9rem;color:var(--text-soft);padding:9px 15px;border-radius:11px;border:1px solid var(--line-strong);background:rgba(255,255,255,0.02);transition:color .2s var(--ease),border-color .2s var(--ease),background .2s var(--ease),transform .2s var(--ease)}
.nav-login svg{opacity:.85}
.nav-login:hover{color:#fff;border-color:var(--silver-400);background:rgba(255,255,255,0.06);transform:translateY(-1px)}
.mobile-menu .m-login{display:flex;align-items:center;gap:9px;color:var(--silver-200)}
@media (max-width:720px){.nav-cta .nav-login{display:none}}
/* Nav actions — slimmer, slicker, tucked into the top-right corner */
.nav .container{max-width:100%;padding:0 clamp(16px,2vw,32px)}
.nav-cta{gap:9px}
.nav .btn{padding:8px 16px;font-size:0.85rem;border-radius:9px}
.nav .btn-metal{box-shadow:0 4px 16px -9px rgba(180,190,205,0.35)}
.nav .btn-metal:hover{box-shadow:0 8px 22px -10px rgba(190,200,215,0.45)}
.nav .btn-ghost{background:rgba(255,255,255,0.025);border-color:var(--line)}
.nav-login{padding:8px 13px;font-size:0.85rem;border-radius:9px;gap:6px}
.nav-login svg{width:14px;height:14px}
.hidden{display:none !important}

/* ── Mobile refinements ──────────────────────────────────────────────
   Two problems found on an iPhone: the header row was carrying logo +
   wordmark + CTA + burger in ~342px of usable width, and the hero mock-up
   kept its two desktop columns so the leads panel was cut off screen. */

/* Hero mock-up: was an inline grid, so no media query could reach it. */
.frame-split{display:grid;grid-template-columns:1.3fr 1fr;gap:0}
.frame-main{padding:34px;background:linear-gradient(160deg,#0f1216,#0a0c0f)}
.frame-side{padding:22px;border-left:1px solid var(--line);background:var(--ink-800)}
.frame-h{font-family:var(--font-head);font-weight:800;font-size:clamp(1.3rem,5.4vw,1.7rem);margin-top:16px;line-height:1.1}

/* Comparison panels: the dividers must follow the stacking direction. */
.compare-col{padding:34px;border-right:1px solid var(--line)}
.compare-col:last-child{border-right:0}
.compare-us{background:linear-gradient(160deg,rgba(40,46,56,0.5),rgba(18,21,26,0.5))}

@media (max-width:960px){
  .compare-col{border-right:0;border-bottom:1px solid var(--line)}
  .compare-col:last-child{border-bottom:0}
}

@media (max-width:720px){
  /* Swipe across the mock-up rather than stacking it. Stacking destroyed the
     whole point of the graphic — it reads as "a real dashboard, two panes" and
     that only works side by side. The second panel is left peeking at the right
     edge so it's obvious there is more to swipe to. */
  .frame-split{display:flex;grid-template-columns:none;overflow-x:auto;
    scroll-snap-type:x mandatory;overscroll-behavior-x:contain;
    -webkit-overflow-scrolling:touch;scrollbar-width:none}
  .frame-split::-webkit-scrollbar{display:none}
  .frame-main,.frame-side{flex:0 0 87%;min-width:0;scroll-snap-align:start}
  .frame-main{padding:26px 22px}
  .frame-side{padding:22px;border-left:1px solid var(--line);border-top:0}
  .compare-col{padding:26px 22px}
}

@media (max-width:640px){
  /* Header: drop the CTA (it's the full-width button in the menu) and trim
     the logo. Nav height and the menu's top inset must move together. */
  .nav-inner{height:64px}
  .mobile-menu{inset:64px 0 0}
  .nav-cta .btn-metal{display:none}
  .nav-mark{height:34px}
  .wordmark{font-size:1.04rem}
  .nav-logo{gap:8px}
  .nav-toggle{padding:8px 2px 8px 8px;margin-right:-2px}
  .hero{padding-top:112px}
}

/* Menu CTA. It was inheriting .mobile-menu a — 1.4rem type, the menu's link
   padding on top of the button's own, and a stray border-bottom — because
   .mobile-menu a outranks .btn. Excluded above; sized properly here.
   Hugs its content and sits left, matching the menu's left-aligned type
   instead of spanning the screen as a slab. */
.mobile-menu .menu-cta{
  align-self:flex-start;
  width:auto;
  margin-top:30px;
  padding:12px 24px;
  font-size:0.95rem;
  border-radius:11px;
  border-bottom:0;
  box-shadow:0 8px 22px -10px rgba(180,190,205,0.34);
}

/* The chat launcher floats above the menu (z-index 2147482000 vs 55) and was
   overlapping the CTA. Sibling selector: both are children of <body>, and the
   launcher is appended after the menu. No JS coupling needed. */
.mobile-menu.open ~ .fcwd-chat-launch{opacity:0;pointer-events:none;transform:scale(.9)}

/* ── CMS-managed regions ─────────────────────────────────────────────
   Everything between the <!-- fc:NAME --> markers is generated at build
   time by build-content.js from what the owner typed in the portal.

   The :has() rule is the important one. build-content deliberately leaves
   a region alone when there is nothing to put in it, so an empty region
   would otherwise leave a heading stranded over blank space. This collapses
   the whole section instead, which means the markers can be added to every
   page up front and the sections simply appear as content is added. */
.fc-block:not(:has(.fc-service,.fc-review,.fc-shot,.fc-about,.fc-hours,.fc-contact)){display:none}

.fc-grid{display:grid;gap:24px;grid-template-columns:repeat(auto-fit,minmax(290px,1fr))}

/* Services */
.fc-service{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:30px;transition:transform .4s var(--ease),border-color .4s,background .4s}
.fc-service:hover{transform:translateY(-6px);border-color:var(--line-strong);background:var(--panel-hi)}
.fc-service h3{margin-bottom:12px}
.fc-service p{color:var(--text-soft)}
.fc-service-list{list-style:none;padding:0;margin:18px 0 0;display:flex;flex-direction:column;gap:10px;color:var(--text-soft);font-size:.95rem}
.fc-service-list li::before{content:"\2713";color:var(--silver-300);margin-right:10px}

/* Reviews */
.fc-review{margin:0;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);padding:28px;display:flex;flex-direction:column;gap:14px}
.fc-review-stars{color:#e8c37a;letter-spacing:3px;font-size:1.05rem;line-height:1}
.fc-review blockquote{margin:0}
.fc-review blockquote p{color:var(--text-soft);font-size:1.02rem}
.fc-review figcaption{font-family:var(--font-head);font-weight:600;color:var(--text);font-size:.95rem;margin-top:auto}
.fc-review-date{color:var(--text-mute);font-weight:400}

/* Gallery — images always carry width/height from the store, so the
   aspect-ratio box below never causes a shift, it just keeps the grid tidy. */
.fc-shot{margin:0;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);background:var(--ink-800)}
.fc-shot img{display:block;width:100%;height:auto}
.fc-shot figcaption{padding:14px 18px;color:var(--text-mute);font-size:.9rem;border-top:1px solid var(--line)}

/* About */
.fc-about{max-width:760px}
.fc-about h2{margin-bottom:20px}
.fc-about p{color:var(--text-soft);font-size:1.05rem}
.fc-about p+p{margin-top:18px}

/* Opening hours */
.fc-hours{margin:0}
.fc-hours-row{display:flex;justify-content:space-between;gap:20px;padding:13px 0;border-bottom:1px solid var(--line)}
.fc-hours-row:last-child{border-bottom:0}
.fc-hours dt{color:var(--text-soft)}
.fc-hours dd{margin:0;font-family:var(--font-head);font-weight:600;color:var(--text)}

/* Contact */
.fc-contact{display:flex;flex-direction:column;gap:12px;font-size:1.02rem}
.fc-contact a{color:var(--text);border-bottom:1px solid var(--line-strong);padding-bottom:2px;align-self:flex-start;transition:border-color .2s,color .2s}
.fc-contact a:hover{color:#fff;border-bottom-color:var(--silver-400)}
.fc-contact-address{color:var(--text-soft)}