@import url("../tokens/fonts.css");
@import url("../tokens/colors.css");
@import url("../tokens/typography.css");
@import url("../tokens/spacing.css");
@import url("../tokens/shape-motion.css");
@import url("../tokens/base.css");

html{scroll-behavior:smooth}
body{overflow-x:hidden}
.wrap{max-width:var(--container-max);margin:0 auto;padding:0 var(--page-margin)}
.narrow{max-width:var(--container-narrow)}
.sec{padding:var(--section-y) 0;position:relative}
.sec.tight{padding:var(--section-y-tight) 0}
.sec.alt{background:var(--bg-page-alt)}
.sec.dark{background:var(--bg-inverse);color:var(--text-on-inverse)}
.sec.dark a{color:var(--text-accent-on-inverse)}
.eyebrow{display:flex;align-items:center;gap:14px;font:600 var(--fs-label)/1 var(--font-brand);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-accent)}
.eyebrow::after{content:"";width:var(--rule-accent-w);height:var(--rule-accent-h);background:var(--color-accent);flex:none}
.dark .eyebrow{color:var(--text-accent-on-inverse)}
.h1{font:500 var(--fs-h1)/var(--lh-heading) var(--font-serif);letter-spacing:var(--ls-display)}
.h2{font:500 var(--fs-h2)/var(--lh-heading) var(--font-serif)}
.h3{font:500 var(--fs-h3)/var(--lh-snug) var(--font-serif)}
.lead{font-size:var(--fs-body-lg);line-height:1.55;color:var(--text-secondary);max-width:60ch}
.dark .lead{color:var(--text-on-inverse-muted)}
.muted{color:var(--text-secondary)}
.head{display:flex;flex-direction:column;gap:18px;margin-bottom:clamp(32px,4vw,56px);max-width:760px}
.head-row{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:24px;margin-bottom:clamp(32px,4vw,56px)}
.head-row .head{margin:0}
.brandline{font:800 clamp(1.1rem,.9rem + .8vw,1.5rem)/1.1 var(--font-brand);text-transform:uppercase;letter-spacing:.01em}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:var(--touch-min);padding:14px 24px;font:600 var(--fs-button)/1 var(--font-sans);letter-spacing:var(--ls-button);text-decoration:none;border:1.5px solid transparent;border-radius:0;cursor:pointer;transition:var(--transition-hover),transform var(--dur-fast) var(--ease-standard);white-space:nowrap}
.btn .ic{transition:transform var(--dur-fast) var(--ease-standard)}
.btn:hover .ic.arrow{transform:translateX(3px)}
.btn-primary{background:var(--interactive-primary);color:var(--text-on-accent)}
.btn-primary:hover{background:var(--interactive-primary-hover);color:#fff}
.btn-primary:active{background:var(--interactive-primary-active)}
.btn-outline{border-color:var(--border-ink);color:var(--text-primary);background:transparent}
.btn-outline:hover{background:var(--interactive-secondary);color:var(--text-on-inverse)}
.dark .btn-outline,.closing .btn-outline{border-color:var(--sd-marfil);color:var(--sd-marfil)}
.dark .btn-outline:hover,.closing .btn-outline:hover{background:var(--sd-marfil);color:var(--sd-carbon-800)}
.btn-wa{background:var(--color-whatsapp);color:#fff}
.btn-wa:hover{background:#17643e;color:#fff}
.btn-lg{padding:17px 28px;font-size:1.0625rem}
.btn:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.link-arrow{display:inline-flex;align-items:center;gap:8px;font-weight:600;text-decoration:none}
.link-arrow:hover{text-decoration:underline}
.btns{display:flex;flex-wrap:wrap;gap:12px}

/* icons */
.ic{display:inline-flex;width:24px;height:24px;flex:none;color:inherit}
.ic svg{width:100%;height:100%}
.ic-sm{width:18px;height:18px}.ic-lg{width:32px;height:32px}

/* provisional strip */
.provisional{background:var(--sd-ocre-100);color:var(--sd-carbon-800);font-size:var(--fs-caption);padding:8px var(--page-margin);text-align:center}

/* header */
.site-header{position:sticky;top:0;z-index:50;background:var(--bg-page);border-bottom:1px solid var(--border-subtle)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:84px}
.logo img{height:46px;width:auto}
.nav{display:flex;align-items:center;gap:clamp(14px,1.6vw,26px)}
.nav a{font:500 .9375rem/1 var(--font-sans);color:var(--text-primary);text-decoration:none;padding:10px 0;border-bottom:2px solid transparent}
.nav a:hover{border-bottom-color:var(--border-strong)}
.nav a[aria-current="page"]{border-bottom-color:var(--color-accent)}
.menu-btn{display:none;width:44px;height:44px;align-items:center;justify-content:center;background:none;border:0;color:var(--text-primary);cursor:pointer}
.mobile-nav{display:none}
@media(max-width:1180px){.nav,.site-header .btn-head{display:none}.menu-btn{display:inline-flex}
.mobile-nav.open{display:flex;flex-direction:column;position:absolute;left:0;right:0;top:100%;background:var(--bg-page);border-bottom:1px solid var(--border-subtle);box-shadow:var(--shadow-2);padding:8px var(--page-margin) 24px}
.mobile-nav a.l{font:500 1.125rem/1 var(--font-sans);color:var(--text-primary);text-decoration:none;padding:16px 0;border-bottom:1px solid var(--border-subtle)}
.mobile-nav .btns{margin-top:20px}.mobile-nav .btn{flex:1}}
@media(max-width:520px){.logo img{height:38px}.site-header .wrap{min-height:72px}}

/* whatsapp float */
.wa-float{position:fixed;right:20px;bottom:20px;z-index:60;display:inline-flex;align-items:center;gap:10px;height:56px;padding:0 20px 0 16px;border-radius:var(--radius-pill);background:var(--color-whatsapp);color:#fff;text-decoration:none;font:600 .9375rem/1 var(--font-sans);box-shadow:var(--shadow-3);transition:background var(--dur-fast)}
.wa-float:hover{background:#17643e;color:#fff}
.wa-float .ic{width:26px;height:26px}
@media(max-width:640px){.wa-float span.t{display:none}.wa-float{width:56px;padding:0;justify-content:center}}

/* hero */
.hero{padding:clamp(40px,6vw,88px) 0 var(--section-y)}
.hero .wrap{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);gap:clamp(40px,6vw,96px);align-items:center}
.hero-txt{display:flex;flex-direction:column;gap:26px}
.hero-brand{font:900 var(--fs-display-brand)/.92 var(--font-brand);letter-spacing:-.02em;text-transform:uppercase;margin:0}
.hero-brand span{color:var(--color-accent);display:block}
.hero-pos{font:500 var(--fs-h3)/1.15 var(--font-serif);letter-spacing:-.01em}
.layers{position:relative;padding:56px 56px 0 0}
.layers .back{position:absolute;top:0;right:0;width:56%;aspect-ratio:4/5;margin:0}
.layers .back img{width:100%;height:100%;object-fit:cover;filter:saturate(.8)}
.layers .front{position:relative;margin:0;width:88%;aspect-ratio:4/3;box-shadow:var(--shadow-3)}
.layers .front img{width:100%;height:100%;object-fit:cover}
.tag{position:absolute;padding:7px 11px;font:600 10px/1 var(--font-brand);letter-spacing:.22em;text-transform:uppercase;background:var(--sd-carbon-800);color:var(--sd-marfil)}
.tag.light{background:var(--sd-marfil);color:var(--sd-carbon-800)}
.tag.accent{background:var(--interactive-primary);color:#fff}
.tag.tl{top:12px;left:12px}.tag.tr{top:12px;right:12px}.tag.bl{bottom:12px;left:12px}.tag.br{bottom:12px;right:12px}
@media(max-width:900px){.hero .wrap{grid-template-columns:1fr}.layers{padding:40px 32px 0 0}}

/* concept row */
.concepts{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));border-top:1px solid var(--border-subtle);border-bottom:1px solid var(--border-subtle)}
.concept{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px;padding:32px 16px;color:var(--text-accent)}
.concept+.concept{border-left:1px solid var(--border-subtle)}
.concept b{font:600 .75rem/1.6 var(--font-brand);letter-spacing:.2em;text-transform:uppercase;color:var(--text-primary)}
@media(max-width:900px){.concepts{grid-template-columns:repeat(2,minmax(0,1fr))}.concept+.concept{border-left:0}.concept{border-bottom:1px solid var(--border-subtle)}.concept:nth-child(even){border-left:1px solid var(--border-subtle)}.concept:last-child{grid-column:1/-1;border-bottom:0}}

/* split */
.split{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,80px);align-items:center}
.split.rev{grid-template-columns:minmax(0,7fr) minmax(0,5fr)}
.split.even{grid-template-columns:repeat(2,minmax(0,1fr));align-items:start}
@media(max-width:900px){.split,.split.rev,.split.even{grid-template-columns:1fr}}
.stack{display:flex;flex-direction:column;gap:22px}
.sticky{position:sticky;top:120px}
@media(max-width:900px){.sticky{position:static}}

/* before/after */
.ba{position:relative;aspect-ratio:3/2;overflow:hidden;user-select:none;background:var(--surface-muted);touch-action:pan-y}
.ba img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;pointer-events:none}
.ba .after{clip-path:inset(0 0 0 var(--p,50%))}
.ba .handle{position:absolute;top:0;bottom:0;left:var(--p,50%);width:2px;background:#fff;transform:translateX(-1px);pointer-events:none}
.ba .knob{position:absolute;top:50%;left:50%;width:52px;height:52px;margin:-26px 0 0 -26px;border-radius:50%;background:#fff;color:var(--text-accent);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-2);font:600 18px/1 var(--font-sans)}
.ba input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0}
.ba input:focus-visible+.handle .knob{box-shadow:var(--focus-ring)}

/* behind reveal */
.reveal{position:relative;display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);background:var(--surface-card);border:1px solid var(--border-subtle);overflow:hidden}
.reveal .ph{position:relative;aspect-ratio:4/3;overflow:hidden}
.reveal .ph img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.reveal .ph .res{transition:clip-path var(--dur-reveal) var(--ease-reveal);clip-path:inset(0 0 0 0)}
.reveal.open .ph .res{clip-path:inset(0 100% 0 0)}
.reveal .ph .proc{filter:saturate(.8)}
.reveal .txt{padding:clamp(24px,3vw,44px);display:flex;flex-direction:column;gap:18px}
.reveal .pane{display:flex;flex-direction:column;gap:14px}
.reveal .pane.b{display:none}.reveal.open .pane.a{display:none}.reveal.open .pane.b{display:flex}
.reveal ul{list-style:none;margin:0;padding:0}
.reveal li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;padding:14px 0;border-top:1px solid var(--border-subtle);font-size:var(--fs-small)}
.reveal li .ic{color:var(--text-accent)}
.reveal li b{display:block;font-size:var(--fs-body);color:var(--text-primary)}
.reveal .toggle{align-self:flex-start;margin-top:auto}
@media(max-width:900px){.reveal{grid-template-columns:1fr}}

/* filter list */
.checks{list-style:none;margin:0;padding:0}
.checks li{display:grid;grid-template-columns:30px minmax(0,1fr);gap:12px;padding:18px 0;border-top:1px solid var(--border-on-inverse);font-size:1.125rem;line-height:1.5}
.checks li .ic{color:var(--text-accent-on-inverse)}
.checks li.no .ic{color:var(--text-on-inverse-muted)}
.checks li.no{color:var(--text-on-inverse-muted)}

/* person */
.slot{position:relative;background:var(--surface-muted);border:1.5px dashed var(--border-strong);display:flex;align-items:center;justify-content:center;text-align:center;padding:24px;color:var(--text-muted);font-size:var(--fs-small)}
.slot.portrait{aspect-ratio:4/5}
.person-photo{position:relative;box-shadow:var(--shadow-behind);max-width:460px}
.quote{font:400 italic var(--fs-quote)/1.3 var(--font-serif);margin:0;padding-left:0;text-wrap:balance}
.quote::before{content:"«"}.quote::after{content:"»"}
.sig{font:600 var(--fs-label)/1.5 var(--font-brand);letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted)}
.sig b{color:var(--text-primary);font-weight:800;letter-spacing:.06em;display:block;font-size:.875rem}

/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));border-top:2px solid var(--border-ink)}
.steps li{padding:22px 20px 22px 0;display:flex;flex-direction:column;gap:8px;border-bottom:1px solid var(--border-strong)}
.steps .n{font:800 .8125rem/1 var(--font-brand);color:var(--text-accent);letter-spacing:.06em}
.steps b{font:500 1.25rem/1.2 var(--font-serif)}
.steps small{font-size:var(--fs-small);color:var(--text-secondary);line-height:1.5}
.steps em{font-style:normal;font:600 10px/1.4 var(--font-brand);letter-spacing:.2em;text-transform:uppercase;color:var(--text-accent)}

/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(24px,3vw,40px)}
.card{display:flex;flex-direction:column;gap:16px;text-decoration:none;color:inherit}
.card .ph{position:relative;aspect-ratio:4/3;transition:transform var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard)}
.card .ph img{width:100%;height:100%;object-fit:cover}
.card:hover .ph{transform:translate(-4px,-4px);box-shadow:var(--shadow-behind)}
.card .meta{font:600 var(--fs-label)/1 var(--font-brand);letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted)}
.card h3{font:500 1.5rem/1.2 var(--font-serif)}
.card:hover h3{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.15em}
.card p{font-size:var(--fs-small);color:var(--text-secondary)}
.card p b{color:var(--text-accent);font-weight:600}

/* reviews placeholder */
.reviews{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:24px}
.reviews .slot{min-height:200px;flex-direction:column;gap:8px}

/* faq */
.faq{border-top:1px solid var(--border-strong)}
.faq details{border-bottom:1px solid var(--border-strong)}
.faq summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0;font:500 1.25rem/1.3 var(--font-serif)}
.faq summary::-webkit-details-marker{display:none}
.faq summary .ic{color:var(--text-accent);transition:transform var(--dur-base) var(--ease-standard)}
.faq details[open] summary .ic{transform:rotate(45deg)}
.faq summary:focus-visible{outline:2px solid var(--interactive-focus);outline-offset:4px}
.faq .a{padding:0 48px 24px 0;color:var(--text-secondary);max-width:68ch}

/* closing */
.closing{background:var(--bg-inverse);color:var(--text-on-inverse);position:relative;overflow:hidden}
.closing .wrap{display:flex;flex-wrap:wrap;align-items:flex-end;justify-content:space-between;gap:32px;padding-top:var(--section-y-tight);padding-bottom:var(--section-y-tight);position:relative}
.closing .h2{max-width:720px}
.closing .h2 span{color:var(--text-accent-on-inverse)}
.bands{position:absolute;right:-40px;top:-30px;width:300px;opacity:.14;pointer-events:none}

/* footer */
.site-footer{background:var(--bg-inverse-deep);color:var(--text-on-inverse-muted);font-size:var(--fs-small)}
.site-footer .top{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(3,minmax(0,1fr));gap:40px;padding:64px 0 48px}
.site-footer img.fl{width:220px;height:auto}
.site-footer h4{font:600 var(--fs-label)/1 var(--font-brand);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--sd-marfil);margin:0 0 16px}
.site-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.site-footer a{color:var(--text-on-inverse-muted);text-decoration:none}
.site-footer a:hover{color:var(--sd-marfil);text-decoration:underline}
.site-footer .row-c{display:flex;align-items:center;gap:10px}
.site-footer .social{display:inline-flex;width:44px;height:44px;align-items:center;justify-content:center;border:1px solid var(--border-on-inverse);color:var(--sd-marfil)}
.site-footer .social:hover{background:var(--sd-marfil);color:var(--sd-carbon-900)}
.site-footer .bottom{border-top:1px solid var(--border-on-inverse);padding:20px 0 96px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:var(--fs-caption)}
.site-footer .bottom nav{display:flex;flex-wrap:wrap;gap:20px}
@media(max-width:900px){.site-footer .top{grid-template-columns:1fr 1fr}.site-footer .top>div:first-child{grid-column:1/-1}}

/* page hero (interiores) */
.page-hero{padding:clamp(40px,6vw,88px) 0 clamp(40px,5vw,72px);border-bottom:1px solid var(--border-subtle)}
.crumbs{display:flex;flex-wrap:wrap;gap:8px;font-size:var(--fs-caption);color:var(--text-muted);margin-bottom:28px}
.crumbs a{color:var(--text-muted)}
.crumbs span[aria-hidden]{color:var(--border-strong)}

/* timeline (trayectoria) */
.tl{list-style:none;margin:0;padding:0;position:relative}
.tl li{display:grid;grid-template-columns:140px minmax(0,1fr);gap:24px;padding:28px 0;border-top:1px solid var(--border-subtle)}
.tl .y{font:800 1.75rem/1 var(--font-brand);color:var(--text-accent);letter-spacing:-.01em}
.tl b{font:500 1.375rem/1.25 var(--font-serif);display:block;margin-bottom:8px}
.tl p{color:var(--text-secondary);max-width:62ch}
@media(max-width:640px){.tl li{grid-template-columns:1fr;gap:10px}}

.lines{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));border-top:1px solid var(--border-on-inverse)}
.lines div{padding:24px 20px 24px 0;border-bottom:1px solid var(--border-on-inverse);font:800 1.125rem/1.25 var(--font-brand);text-transform:uppercase}
.lines div span{display:block;color:var(--text-accent-on-inverse)}

/* forms */
.contact-ways{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:1px;background:var(--border-subtle);border:1px solid var(--border-subtle)}
.contact-ways a{background:var(--surface-card);padding:24px;display:flex;flex-direction:column;gap:10px;text-decoration:none;color:var(--text-primary)}
.contact-ways a:hover{background:var(--sd-marfil-2)}
.contact-ways .ic{color:var(--text-accent)}
.contact-ways b{font:600 var(--fs-label)/1 var(--font-brand);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-muted)}
.contact-ways span{font:500 1.125rem/1.3 var(--font-sans);word-break:break-word}
.form-card{background:var(--surface-card);border:1px solid var(--border-subtle);padding:clamp(24px,4vw,48px)}
.stepper{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-bottom:36px;list-style:none;padding:0}
.stepper li{border-top:3px solid var(--border-subtle);padding-top:10px;font:600 var(--fs-label)/1.4 var(--font-brand);letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted)}
.stepper li.on{border-color:var(--color-accent);color:var(--text-primary)}
.stepper li.done{border-color:var(--sd-carbon-800);color:var(--text-secondary)}
fieldset{border:0;margin:0;padding:0;display:flex;flex-direction:column;gap:24px;min-width:0}
fieldset[hidden]{display:none}
legend{font:500 var(--fs-h3)/1.2 var(--font-serif);margin-bottom:8px;padding:0}
.field{display:flex;flex-direction:column;gap:8px}
.field>label,.field>.lbl{font-weight:600;font-size:var(--fs-small)}
.field .opt{font-weight:400;color:var(--text-muted)}
.field .hint{font-size:var(--fs-caption);color:var(--text-muted)}
.field input[type=text],.field input[type=email],.field input[type=tel],.field input[type=number],.field select,.field textarea{font:400 1rem/1.4 var(--font-sans);color:var(--text-primary);background:var(--sd-blanco);border:1.5px solid var(--border-strong);border-radius:var(--radius-control);padding:12px 14px;min-height:var(--touch-min);width:100%;transition:border-color var(--dur-fast)}
.field textarea{min-height:150px;resize:vertical}
.field input:hover,.field select:hover,.field textarea:hover{border-color:var(--sd-carbon-500)}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--interactive-focus);box-shadow:0 0 0 3px var(--sd-terracota-100)}
.field.err input,.field.err select,.field.err textarea{border-color:var(--status-error)}
.field .msg{display:none;align-items:center;gap:6px;font-size:var(--fs-caption);color:var(--status-error);font-weight:600}
.field.err .msg{display:flex}
.grid2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
@media(max-width:640px){.grid2{grid-template-columns:1fr}}
.choices{display:flex;flex-wrap:wrap;gap:10px}
.choice{position:relative}
.choice input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.choice span{display:inline-flex;align-items:center;min-height:var(--touch-min);padding:10px 16px;border:1.5px solid var(--border-strong);background:var(--sd-blanco);font-size:.9375rem;transition:var(--transition-hover)}
.choice:hover span{border-color:var(--sd-carbon-500)}
.choice input:checked+span{background:var(--sd-carbon-800);border-color:var(--sd-carbon-800);color:var(--sd-marfil)}
.choice input:focus-visible+span{box-shadow:var(--focus-ring)}
.check{display:grid;grid-template-columns:22px minmax(0,1fr);gap:12px;font-size:var(--fs-small);align-items:start}
.check input{width:20px;height:20px;margin:2px 0 0;accent-color:var(--interactive-primary)}
.form-nav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:12px;padding-top:24px;border-top:1px solid var(--border-subtle)}
.alert{display:flex;gap:14px;padding:20px 22px;font-size:var(--fs-small)}
.alert.ok{background:var(--status-success-bg);color:var(--status-success)}
.alert.ko{background:var(--status-error-bg);color:var(--status-error)}
.alert b{display:block;font-size:var(--fs-body);color:var(--text-primary);margin-bottom:4px}
.done-box{display:flex;flex-direction:column;gap:24px}

/* legal */
.legal h2{font:500 var(--fs-h3)/1.2 var(--font-serif);margin:40px 0 12px}
.legal p,.legal li{color:var(--text-secondary);margin-bottom:12px}
.legal .todo{background:var(--sd-ocre-100);padding:2px 6px;color:var(--sd-carbon-800)}

.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:absolute;left:-9999px}.skip:focus{left:16px;top:16px;z-index:100;background:#fff;padding:12px}

/* páginas interiores */
.photo{margin:0;position:relative;overflow:hidden;background:var(--surface-muted)}
.photo img{display:block;width:100%;height:100%;object-fit:cover}
.r34{aspect-ratio:3/4}
.types{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:clamp(24px,3vw,40px)}
.type{display:flex;flex-direction:column;gap:14px}
.type .photo,.type .slot{aspect-ratio:3/4}
.type h3{font:500 1.5rem/1.2 var(--font-serif)}
.incl{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));column-gap:24px;border-top:1px solid var(--border-strong)}
.incl.one{grid-template-columns:1fr}
.incl li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:12px;align-items:start;padding:18px 0;border-bottom:1px solid var(--border-subtle);line-height:1.5}
.incl .ic{color:var(--text-accent)}
.gal3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,24px)}
.gal3 .photo{aspect-ratio:3/4}
@media(max-width:700px){.gal3{grid-template-columns:1fr 1fr}.gal3 .photo:first-child{grid-column:1/-1;aspect-ratio:4/3}}
.process{list-style:none;margin:0;padding:0;border-top:2px solid var(--border-ink)}
.process li{display:grid;grid-template-columns:90px minmax(0,6fr) minmax(0,5fr);gap:clamp(20px,3vw,48px);padding:36px 0;border-bottom:1px solid var(--border-strong);align-items:start}
.process .n{font:800 2rem/1 var(--font-brand);color:var(--text-accent)}
.process .fam{font-style:normal;font:600 var(--fs-label)/1.4 var(--font-brand);letter-spacing:.2em;text-transform:uppercase;color:var(--text-accent)}
.behind{background:var(--bg-page-alt);padding:20px 22px;font-size:var(--fs-small);color:var(--text-secondary);line-height:1.55;box-shadow:var(--shadow-behind)}
.behind b{display:block;font:600 var(--fs-label)/1 var(--font-brand);letter-spacing:var(--ls-label);text-transform:uppercase;color:var(--text-primary);margin-bottom:10px}
@media(max-width:800px){.process li{grid-template-columns:1fr;gap:14px}}
.jump{display:flex;flex-wrap:wrap;gap:10px}
.jump a{display:inline-flex;align-items:center;min-height:var(--touch-min);padding:10px 16px;border:1.5px solid var(--border-strong);text-decoration:none;color:var(--text-primary);font-size:.9375rem}
.jump a:hover{background:var(--sd-carbon-800);border-color:var(--sd-carbon-800);color:var(--sd-marfil)}
.case-sec{border-top:1px solid var(--border-subtle);scroll-margin-top:100px}
.case-sec:nth-child(odd of .case-sec){background:var(--bg-page-alt)}
.case{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:clamp(32px,5vw,72px);padding-top:var(--section-y-tight);padding-bottom:var(--section-y-tight);align-items:start}
.case .meta,.fam-card .meta,.pro .meta{font:600 var(--fs-label)/1 var(--font-brand);letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted)}
.gal{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.gal .photo{aspect-ratio:3/4}
.gal .photo.big{grid-column:1/-1;aspect-ratio:3/2}
.gal.g3{grid-template-columns:1fr 1fr}
.gal .photo.big+.photo:last-child{grid-column:1/-1;aspect-ratio:3/2}
.gal.g3 .photo:first-child{grid-column:1/-1;aspect-ratio:4/3}
.case dl{margin:0}
.case dl div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:16px;padding:16px 0;border-top:1px solid var(--border-subtle)}
.case dt{font:600 var(--fs-label)/1.5 var(--font-brand);letter-spacing:.16em;text-transform:uppercase;color:var(--text-muted)}
.case dd{margin:0;color:var(--text-secondary)}
.case dl .hl dt{color:var(--text-accent)}
.case dl .hl dd{color:var(--text-primary);font-weight:500}
@media(max-width:900px){.case{grid-template-columns:1fr}}
@media(max-width:520px){.case dl div{grid-template-columns:1fr;gap:6px}}
.fams{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:clamp(28px,3vw,44px)}
.fam-card{display:flex;flex-direction:column;gap:14px}
.fam-card .photo{aspect-ratio:4/3}
.pros{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:clamp(24px,3vw,40px)}
.pro{display:flex;flex-direction:column;gap:16px;border-top:3px solid var(--color-accent);padding-top:22px}