:root {
  --ink:#25312e;
  --ink-soft:#3f4a46;
  --muted:#5b6762;
  --bg:#fbf6f0;
  --paper:#fffdf9;
  --line:#d8cfc5;
  --mint:#b9d9ce;
  --mint-soft:#dcebe2;
  --forest:#315c51;
  --sand:#f2e8cb;
  --blush:#f5e3de;
  --sky:#e3edf1;
  --lavender:#e7e2f0;
  --peach:#f2ddc8;
  --night:#233b36;
  --slate:#334654;
  --plum:#493d4e;
  --display:'Fraunces',Georgia,serif;
  --sans:'Manrope',Arial,sans-serif;
}

* { box-sizing:border-box }
html { scroll-behavior:smooth }
body { margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.6 }
a { color:inherit; text-decoration:none }
img { display:block; max-width:100% }
.shell { width:min(100% - 64px,1280px); margin-inline:auto }
.skip-link { position:fixed; left:16px; top:-90px; z-index:100; padding:12px 16px; background:var(--paper); color:var(--ink); box-shadow:0 6px 24px rgba(0,0,0,.18) }
.skip-link:focus { top:16px }
.visually-hidden { position:absolute!important; width:1px!important; height:1px!important; padding:0!important; margin:-1px!important; overflow:hidden!important; clip:rect(0,0,0,0)!important; white-space:nowrap!important; border:0!important }

.preview-note { background:var(--night); color:var(--paper); font-size:.72rem; letter-spacing:.025em }
.preview-note .shell { min-height:38px; display:flex; align-items:center; justify-content:center; gap:10px; text-align:center }
.preview-note strong { color:var(--peach); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase }

.site-header { position:sticky; top:0; z-index:50; background:rgba(251,246,240,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(16px) }
.header-inner { min-height:78px; display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:32px }
.brand { display:inline-flex; align-items:center; gap:12px; width:max-content; font-size:1.45rem; font-weight:700; letter-spacing:-.055em }
.brand-mark { width:28px; height:28px; border:7px solid var(--mint); border-radius:50%; background:var(--ink) }
.site-header nav { display:flex; gap:30px; font-size:.82rem; font-weight:600 }
.site-header nav a { padding:8px 0; border-bottom:1px solid transparent }
.site-header nav a:hover { border-color:var(--ink) }
.header-contact { justify-self:end; min-height:44px; display:inline-flex; align-items:center; padding:0 18px; border:1px solid var(--ink); border-radius:999px; font-size:.78rem; font-weight:700 }
.header-contact:hover { background:var(--ink); color:white }

.hero { display:grid; grid-template-columns:minmax(0,1.18fr) minmax(390px,.82fr); gap:8vw; align-items:center; min-height:690px; padding-block:78px }
.eyebrow { margin:0; color:var(--forest); font-size:.7rem; font-weight:700; letter-spacing:.17em }
.hero h1 { max-width:800px; margin:24px 0 30px; font:500 clamp(4rem,6.9vw,7.1rem)/.9 var(--display); letter-spacing:-.06em }
.hero-lead { max-width:660px; margin:0; color:#414b45; font-size:1.08rem; line-height:1.85 }
.hero-actions { display:flex; align-items:center; flex-wrap:wrap; gap:25px; margin-top:38px }
.button { min-height:50px; display:inline-flex; align-items:center; justify-content:center; padding:0 23px; border:1px solid var(--ink); border-radius:999px; font-size:.8rem; font-weight:700; text-align:center }
.button-primary { background:var(--ink); color:white }
.button-primary:hover { background:var(--forest); border-color:var(--forest) }
.button-secondary { background:transparent }
.button-secondary:hover { background:var(--paper) }
.text-link { min-height:44px; display:inline-flex; align-items:center; border-bottom:1px solid var(--ink); font-size:.82rem; font-weight:700 }

.hero-object { position:relative; width:min(100%,470px); aspect-ratio:1; display:grid; place-items:center; justify-self:end; border:1px solid rgba(49,92,81,.42); border-radius:50%; background:radial-gradient(circle at 50% 48%,rgba(185,217,206,.62),rgba(245,227,222,.55) 43%,transparent 44%) }
.hero-object:before,.hero-object:after { content:''; position:absolute; inset:12%; border:1px solid rgba(60,97,87,.26); border-radius:50% }
.hero-object:after { inset:27%; border-style:dashed }
.hero-object strong { position:relative; z-index:2; font:400 clamp(7rem,13vw,12rem)/1 var(--display); letter-spacing:-.09em }
.hero-object-label { position:absolute; z-index:3; top:15%; left:50%; translate:-50% 0; font-size:.63rem; font-weight:700; letter-spacing:.18em; white-space:nowrap }
.orbit-tag { position:absolute; z-index:4; padding:7px 12px; border:1px solid rgba(49,92,81,.42); border-radius:999px; color:var(--forest); font-size:.65rem; font-weight:700 }
.orbit-tag-one { top:2%; left:16%; background:var(--mint-soft) }
.orbit-tag-two { top:34%; right:-4%; background:var(--blush) }
.orbit-tag-three { bottom:8%; right:13%; background:var(--sky) }
.orbit-tag-four { bottom:20%; left:-3%; background:var(--lavender) }

.catalog-section { padding-block:125px 140px; background:#f7efe8; border-block:1px solid var(--line) }
.catalog-heading,.approach-heading { display:grid; grid-template-columns:220px minmax(0,1fr); gap:6vw; align-items:start; margin-bottom:72px }
.section-number { display:block; margin-bottom:18px; font:400 3rem/1 var(--display); color:var(--forest) }
.catalog-heading h2,.approach-heading h2 { margin:0; font:400 clamp(3.3rem,5.8vw,6.2rem)/.94 var(--display); letter-spacing:-.05em }
.catalog-heading>div:last-child>p { max-width:610px; margin:25px 0 0; color:var(--muted); line-height:1.85 }
.catalog-heading>div:last-child>.zoom-note { width:max-content; max-width:100%; display:flex; align-items:center; gap:10px; margin-top:22px; padding:10px 14px; border:1px solid rgba(49,92,81,.26); border-radius:999px; background:var(--mint-soft); color:var(--forest); font-size:.72rem; font-weight:700; line-height:1.4 }
.zoom-note>span { width:8px; height:8px; flex:0 0 auto; border-radius:50%; background:var(--forest) }

.catalog-grid { display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:28px }
.workshop { position:relative; overflow:hidden; border:1px solid rgba(37,49,46,.22); background:var(--paper) }
.workshop-feature { grid-column:1/-1; min-height:650px; display:grid; grid-template-columns:minmax(0,1.13fr) minmax(420px,.87fr) }
.workshop-feature[aria-labelledby="workshop-01-title"] .workshop-copy { background:var(--blush) }
.workshop-dark { grid-column:span 5; background:var(--slate); color:var(--paper) }
.workshop-mint { grid-column:span 7; display:grid; grid-template-rows:minmax(0,1fr) 320px; background:var(--mint-soft) }
.workshop-overlay { grid-column:span 7; min-height:735px; background:var(--plum); color:var(--paper) }
.workshop-sand { grid-column:span 5; background:var(--sand) }

.workshop-media { position:relative; min-width:0; overflow:hidden; background:#cfd6d1 }
.workshop-media img,.overlay-image { width:100%; height:100%; object-fit:cover; transition:transform .7s cubic-bezier(.22,.61,.36,1) }
.workshop:hover .workshop-media img,.workshop:hover .overlay-image { transform:scale(1.018) }
.workshop-count { position:absolute; z-index:3; top:20px; left:20px; width:52px; height:52px; display:grid; place-items:center; border-radius:50%; background:rgba(255,255,255,.92); color:var(--ink); font:500 1rem/1 var(--display); backdrop-filter:blur(10px) }
.workshop-copy { position:relative; z-index:3; min-width:0; display:flex; flex-direction:column; padding:45px }
.workshop-topline { min-height:28px; display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:58px; font-size:.66rem; font-weight:700; letter-spacing:.13em; text-transform:uppercase }
.demo-badge { padding:6px 9px; border:1px solid currentColor; border-radius:999px; font-size:.55rem; letter-spacing:.1em; white-space:nowrap; opacity:.76 }
.workshop h3 { margin:0 0 24px; font:400 clamp(3rem,4.5vw,5.3rem)/.92 var(--display); letter-spacing:-.055em }
.workshop-copy>p { max-width:590px; margin:0; color:#4d5751; line-height:1.85 }
.workshop-meta { display:grid; grid-template-columns:repeat(3,1fr); margin:42px 0 34px; padding:0; border-block:1px solid rgba(32,39,35,.18) }
.workshop-meta>div { min-width:0; padding:15px 14px 15px 0 }
.workshop-meta>div+div { padding-left:14px; border-left:1px solid rgba(32,39,35,.18) }
.workshop-meta dt { margin:0 0 5px; color:var(--muted); font-size:.62rem; font-weight:600 }
.workshop-meta dd { margin:0; font-size:.76rem; font-weight:700; line-height:1.4 }
.card-link { width:max-content; min-height:44px; display:inline-flex; align-items:center; margin-top:auto; border-bottom:1px solid currentColor; font-size:.76rem; font-weight:700 }
.booking-trigger { padding:0; border:0; border-bottom:1px solid currentColor; background:transparent; color:inherit; font-family:inherit; cursor:pointer }

.workshop-dark .workshop-media { height:355px; border-bottom:1px solid rgba(255,253,249,.22) }
.workshop-dark .workshop-copy { min-height:480px; padding:38px }
.workshop-dark .workshop-topline { margin-bottom:42px; color:var(--peach) }
.workshop-dark h3 { font-size:clamp(2.85rem,3.6vw,4.25rem) }
.workshop-dark .workshop-copy>p { color:#e5ece9 }
.workshop-dark .workshop-meta { border-color:rgba(255,253,249,.25) }
.workshop-dark .workshop-meta>div+div { border-color:rgba(255,253,249,.25) }
.workshop-dark .workshop-meta dd { color:var(--paper) }

.compact-meta { display:flex; flex-wrap:wrap; gap:0; margin-top:34px }
.compact-meta>div { padding:13px 12px }
.compact-meta>div:first-child { padding-left:0 }
.compact-meta>div+div { border-left:1px solid rgba(32,39,35,.18) }
.compact-meta dd { color:inherit; font-size:.7rem }

.workshop-mint .workshop-copy { padding:42px 44px 40px }
.workshop-mint .workshop-topline { margin-bottom:20px }
.workshop-mint h3 { position:relative; z-index:2; font-size:clamp(3.4rem,5vw,5.7rem) }
.workshop-mint .workshop-media { border-top:1px solid rgba(32,39,35,.14) }
.oversized-number { position:absolute; top:50px; right:38px; color:rgba(60,97,87,.12); font:400 clamp(8rem,14vw,14rem)/.8 var(--display); letter-spacing:-.1em }

.overlay-image { position:absolute; inset:0 }
.overlay-shade { position:absolute; z-index:1; inset:0; background:linear-gradient(180deg,rgba(73,61,78,.08) 5%,rgba(73,61,78,.3) 42%,rgba(73,61,78,.94) 100%) }
.workshop-overlay .workshop-copy { position:absolute; inset:auto 0 0; min-height:540px; justify-content:flex-end; padding:46px }
.workshop-overlay .workshop-topline { position:absolute; top:34px; left:46px; right:46px; margin:0; color:#f2f6f3 }
.workshop-overlay .workshop-count { position:static; width:auto; height:auto; display:block; margin-bottom:25px; background:transparent; color:var(--lavender); font:400 2.5rem/1 var(--display); backdrop-filter:none }
.workshop-overlay h3 { font-size:clamp(3.7rem,5vw,5.8rem) }
.workshop-overlay .workshop-copy>p { max-width:520px; color:#e1e6e2 }
.workshop-overlay .workshop-meta { border-color:rgba(255,255,255,.28) }
.workshop-overlay .workshop-meta>div+div { border-color:rgba(255,255,255,.28) }

.workshop-sand .workshop-media { height:300px; border-bottom:1px solid rgba(32,39,35,.15) }
.workshop-sand .workshop-copy { min-height:435px; padding:38px }
.workshop-sand .workshop-topline { margin-bottom:40px }
.workshop-sand h3 { font-size:clamp(3rem,4vw,4.6rem) }

.workshop-reverse .workshop-media { order:2 }
.workshop-reverse .workshop-copy { order:1; background:var(--sky) }

.approach-section { padding-block:130px; background:var(--night); color:var(--paper) }
.approach-section .section-number,.approach-section .eyebrow { color:var(--peach) }
.approach-grid { display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid rgba(255,253,249,.24); border-left:1px solid rgba(255,253,249,.24) }
.approach-grid article { min-height:305px; padding:34px; border-right:1px solid rgba(255,253,249,.24); border-bottom:1px solid rgba(255,253,249,.24) }
.approach-grid article:nth-child(1) { background:rgba(185,217,206,.06) }
.approach-grid article:nth-child(2) { background:rgba(242,221,200,.07) }
.approach-grid article:nth-child(3) { background:rgba(231,226,240,.07) }
.approach-grid article>span { color:var(--peach); font-size:.68rem; font-weight:700 }
.approach-grid h3 { margin:70px 0 14px; font:400 2rem/1.05 var(--display) }
.approach-grid p { max-width:350px; margin:0; color:#cbd8d2; line-height:1.8 }

.closing { margin-block:80px; padding-block:110px; background:linear-gradient(135deg,var(--blush),var(--sky)); border:1px solid var(--line); text-align:center }
.closing h2 { margin:24px auto 30px; font:400 clamp(3.5rem,5.8vw,6.2rem)/.94 var(--display); letter-spacing:-.052em }
.closing>p:not(.eyebrow) { max-width:660px; margin:0 auto; color:var(--muted); line-height:1.85 }
.closing-actions { display:flex; justify-content:center; flex-wrap:wrap; gap:12px; margin-top:38px }

.booking-dialog { width:min(calc(100% - 34px),680px); max-height:min(90vh,820px); padding:0; border:0; background:transparent; color:var(--ink); overflow:auto }
.booking-dialog::backdrop { background:rgba(29,49,44,.68); backdrop-filter:blur(8px) }
.booking-panel { overflow:hidden; border:1px solid rgba(37,49,46,.22); background:var(--paper); box-shadow:0 28px 80px rgba(29,49,44,.32) }
.booking-header { display:flex; align-items:flex-start; justify-content:space-between; gap:24px; padding:30px 32px; border-bottom:1px solid var(--line); background:linear-gradient(135deg,var(--blush),var(--sky)) }
.booking-header h2 { margin:8px 0 0; font:400 clamp(2.4rem,5vw,3.7rem)/.95 var(--display); letter-spacing:-.045em }
.dialog-close { min-height:42px; padding:0 14px; border:1px solid rgba(37,49,46,.45); border-radius:999px; background:rgba(255,253,249,.55); color:var(--ink); font-family:inherit; font-size:.7rem; font-weight:700; cursor:pointer }
.dialog-close:hover { background:var(--paper) }
.booking-form { display:grid; grid-template-columns:1fr 1fr; gap:20px; padding:30px 32px 34px }
.field { min-width:0; display:flex; flex-direction:column; gap:8px }
.field-wide { grid-column:1/-1 }
.field>span { color:var(--ink-soft); font-size:.72rem; font-weight:700 }
.field small { color:var(--muted); font-size:.65rem; font-weight:500 }
.field input,.field select,.field textarea { width:100%; min-height:48px; padding:12px 13px; border:1px solid var(--line); border-radius:0; outline:none; background:#fffaf5; color:var(--ink); font:500 .9rem/1.4 var(--sans) }
.field textarea { min-height:88px; resize:vertical }
.field input[readonly] { background:var(--mint-soft); color:var(--forest); font-weight:700 }
.field input:focus,.field select:focus,.field textarea:focus { border-color:var(--forest); box-shadow:0 0 0 3px rgba(185,217,206,.5) }
.booking-summary { display:flex; align-items:flex-start; gap:12px; padding:14px; border:1px solid rgba(49,92,81,.2); background:var(--mint-soft) }
.booking-summary>span { width:9px; height:9px; flex:0 0 auto; margin-top:7px; border-radius:50%; background:var(--forest) }
.booking-summary p { margin:0; color:var(--forest); font-size:.74rem; line-height:1.65 }
.booking-form>.button { width:100%; border-radius:0 }

.site-footer { padding:70px 0 26px; background:#1d312c; color:var(--paper) }
.footer-grid { display:grid; grid-template-columns:1.5fr .7fr .8fr; gap:8vw; padding-bottom:52px }
.footer-grid strong { font-size:1.7rem; letter-spacing:-.06em }
.footer-grid p { max-width:340px; margin:12px 0 0; color:#c4d0ca; font-size:.82rem }
.footer-grid>div:not(:first-child) { display:flex; flex-direction:column; gap:9px; font-size:.82rem }
.footer-grid>div:not(:first-child)>span { margin-bottom:8px; color:var(--peach); font-size:.68rem; font-weight:700; letter-spacing:.13em }
.footer-grid a:hover { color:var(--mint) }
.footer-notice { padding-block:20px; border-block:1px solid rgba(255,253,249,.18); color:#c4d0ca; font-size:.7rem; line-height:1.6 }
.footer-bottom { display:flex; justify-content:space-between; gap:24px; padding-top:22px; color:#7f8983; font-size:.68rem }

a:focus-visible { outline:3px solid #7a3e55; outline-offset:4px; box-shadow:0 0 0 2px var(--paper) }

@media(max-width:1040px) {
  .hero { grid-template-columns:1fr 360px; gap:50px }
  .workshop-feature { grid-template-columns:1fr 390px }
  .workshop-copy { padding:38px }
  .workshop-dark { grid-column:span 6 }
  .workshop-mint { grid-column:span 6 }
  .workshop-overlay { grid-column:span 7 }
  .workshop-sand { grid-column:span 5 }
}

@media(max-width:820px) {
  .header-inner { grid-template-columns:1fr auto }
  .site-header nav { display:none }
  .hero { grid-template-columns:1fr; gap:55px; min-height:auto; padding-block:65px 90px }
  .hero-copy { max-width:750px }
  .hero-object { width:min(88vw,450px); justify-self:center }
  .catalog-heading,.approach-heading { grid-template-columns:150px 1fr; gap:42px }
  .catalog-grid { gap:22px }
  .workshop-dark,.workshop-mint,.workshop-overlay,.workshop-sand { grid-column:1/-1 }
  .workshop-feature { grid-template-columns:1fr 1fr; min-height:610px }
  .workshop-mint { grid-template-rows:auto 360px }
  .workshop-overlay { min-height:720px }
  .workshop-sand { display:grid; grid-template-columns:.92fr 1.08fr }
  .workshop-sand .workshop-media { height:auto }
  .workshop-sand .workshop-copy { min-height:540px }
  .approach-grid { grid-template-columns:1fr }
  .approach-grid article { min-height:auto }
  .approach-grid h3 { margin-top:45px }
}

@media(max-width:700px) {
  .shell { width:calc(100% - 34px) }
  .preview-note .shell { min-height:48px; display:block; padding-block:9px; line-height:1.4 }
  .preview-note strong,.preview-note span { display:block }
  .preview-note strong { margin-bottom:2px }
  .site-header { position:relative }
  .header-inner { min-height:70px }
  .header-contact { min-height:40px; padding-inline:13px; font-size:.69rem }
  .brand { gap:9px; font-size:1.22rem }
  .brand-mark { width:23px; height:23px; border-width:6px }
  .hero { padding-block:54px 75px }
  .hero h1 { margin-top:20px; font-size:3.75rem }
  .hero-lead { font-size:.98rem }
  .hero-actions { align-items:flex-start; flex-direction:column; gap:15px }
  .button { width:100%; padding-inline:16px }
  .hero-object { width:90%; }
  .hero-object-label { top:12% }
  .orbit-tag { font-size:.58rem; padding:6px 9px }
  .catalog-section { padding-block:84px 95px }
  .catalog-heading,.approach-heading { grid-template-columns:1fr; gap:36px; margin-bottom:48px }
  .catalog-heading>div:first-child,.approach-heading>div:first-child { display:flex; align-items:center; gap:18px }
  .section-number { margin:0; font-size:2.2rem }
  .catalog-heading h2,.approach-heading h2 { font-size:3.35rem }
  .catalog-grid { grid-template-columns:1fr; gap:18px }
  .workshop-feature,.workshop-sand { grid-column:1; display:flex; flex-direction:column; min-height:0 }
  .workshop-feature .workshop-media,.workshop-sand .workshop-media { order:1; height:auto; aspect-ratio:4/3 }
  .workshop-feature .workshop-copy,.workshop-sand .workshop-copy { order:2; min-height:0 }
  .workshop-dark,.workshop-mint,.workshop-overlay { grid-column:1 }
  .workshop-dark .workshop-media,.workshop-mint .workshop-media { height:auto; aspect-ratio:4/3 }
  .workshop-mint { display:flex; flex-direction:column }
  .workshop-mint .workshop-copy { order:2 }
  .workshop-mint .workshop-media { order:1 }
  .workshop-copy,.workshop-dark .workshop-copy,.workshop-mint .workshop-copy,.workshop-sand .workshop-copy { padding:28px 24px 30px }
  .workshop-dark .workshop-copy { min-height:0 }
  .workshop-topline,.workshop-dark .workshop-topline,.workshop-mint .workshop-topline,.workshop-sand .workshop-topline { margin-bottom:40px }
  .workshop h3,.workshop-dark h3,.workshop-mint h3,.workshop-sand h3 { font-size:3.2rem }
  .workshop-meta { grid-template-columns:1fr; margin-top:32px }
  .workshop-meta>div,.workshop-meta>div+div { padding:11px 0; border-left:0; border-bottom:1px solid rgba(32,39,35,.16) }
  .workshop-meta>div:last-child { border-bottom:0 }
  .compact-meta { display:flex; gap:0 }
  .compact-meta>div,.compact-meta>div+div { width:100%; padding:10px 0; border-left:0 }
  .card-link { margin-top:18px }
  .oversized-number { top:55px; right:20px; font-size:9rem }
  .workshop-overlay { min-height:660px }
  .workshop-overlay .workshop-copy { min-height:100%; padding:28px 24px 30px }
  .workshop-overlay .workshop-topline { top:28px; left:24px; right:24px }
  .workshop-overlay h3 { font-size:3.45rem }
  .approach-section { padding-block:88px }
  .approach-grid article { padding:28px }
  .closing { margin-block:54px; padding:82px 20px }
  .closing h2 { font-size:3.45rem }
  .closing-actions { flex-direction:column }
  .booking-header { padding:24px 20px }
  .booking-form { grid-template-columns:1fr; padding:24px 20px 26px }
  .field-wide { grid-column:auto }
  .dialog-close { padding-inline:11px }
  .footer-grid { grid-template-columns:1fr; gap:35px }
  .footer-bottom { flex-direction:column }
}

@media(prefers-reduced-motion:reduce) {
  * { scroll-behavior:auto!important; transition:none!important }
}