:root{--division-max:1440px;--nav-height:76px;--subnav-height:46px}
html{overflow-x:clip;scroll-padding-top:calc(var(--nav-height) + var(--subnav-height) + 18px)}
body{overflow-x:clip;background:#060606}

/* Navegación global: la marca y las utilidades conservan su lugar; la lista
   central puede desplazarse dentro de su propio carril sin ensanchar el body. */
.topbar .wrap{width:min(calc(100% - 32px),var(--division-max));display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:clamp(16px,2.2vw,34px);min-height:var(--nav-height)}
.global-nav{min-width:0;justify-content:center;gap:clamp(10px,1.35vw,20px);overflow-x:auto;overscroll-behavior-inline:contain;scrollbar-width:none}
.global-nav::-webkit-scrollbar{display:none}
.global-nav a{white-space:nowrap;font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.head-actions{display:flex;align-items:center;gap:8px}
.head-action{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:0 12px;border:1px solid var(--line);color:var(--muted);text-decoration:none;font:500 10px/1 "IBM Plex Mono",monospace;letter-spacing:.08em;text-transform:uppercase;white-space:nowrap}
.head-action:hover{border-color:var(--gold);color:var(--gold)}
.head-action:focus-visible,.division-nav a:focus-visible,.product-link:focus-visible{outline:2px solid var(--gold);outline-offset:4px}

.division-nav{position:sticky;top:var(--nav-height);z-index:18;border-bottom:1px solid var(--line);background:rgba(8,8,8,.92);backdrop-filter:blur(14px)}
.division-nav .wrap{display:flex;align-items:center;gap:20px;min-height:var(--subnav-height);overflow-x:auto;scrollbar-width:none}
.division-nav .wrap::-webkit-scrollbar{display:none}
.division-nav a{flex:0 0 auto;color:#9f9a90;text-decoration:none;font:400 10px/1 "IBM Plex Mono",monospace;letter-spacing:.13em;text-transform:uppercase}
.division-nav a:hover{color:var(--gold)}

/* `.dental-hero` nació con la única división que tenía escena. Ahora la
   tienen las seis, así que el nombre genérico es el bueno; el viejo se
   conserva porque /dental/ ya está publicado con él. */
.dental-hero,.division-hero{position:relative;border-bottom:1px solid var(--line);background:radial-gradient(circle at 30% 42%,rgba(201,168,76,.1),transparent 33%),#060606}
.dental-hero::before,.division-hero::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.22;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(90deg,#000,transparent 68%)}
.hero-grid{position:relative;width:min(calc(100% - 48px),var(--division-max));min-height:calc(100svh - var(--nav-height) - var(--subnav-height));margin:auto;display:grid;grid-template-columns:minmax(480px,1.22fr) minmax(360px,.78fr);grid-template-rows:1fr auto;grid-template-areas:"visual copy" "visual actions";gap:24px clamp(40px,5vw,84px);align-items:center;padding:clamp(44px,7vh,88px) 0 clamp(42px,6vh,72px)}
.hero-copy{grid-area:copy;align-self:end;max-width:600px;position:relative;z-index:2}
.division-mark{margin-bottom:18px;color:var(--gold);font:500 11px/1.4 "IBM Plex Mono",monospace;letter-spacing:.2em;text-transform:uppercase}
.hero-copy h1{max-width:10ch;margin:0;font:400 clamp(52px,5.4vw,84px)/.92 "Cormorant Garamond",serif;letter-spacing:-.025em;text-wrap:balance}
.hero-summary{max-width:540px;margin:26px 0 0;color:#cdc8bd;font-size:clamp(16px,1.35vw,20px);line-height:1.7}
.hero-actions{grid-area:actions;align-self:start;display:flex;flex-wrap:wrap;gap:12px;margin:0;position:relative;z-index:2}
.hero-actions .btn{min-width:190px}

.hero-visual{grid-area:visual;align-self:stretch;min-width:0;display:grid;grid-template-columns:74px minmax(0,1fr);gap:20px;min-height:560px;position:relative;isolation:isolate}
.scene-frame{position:relative;min-width:0;min-height:520px;overflow:hidden;border-inline:1px solid rgba(255,255,255,.055);background:radial-gradient(circle at 50% 46%,rgba(201,168,76,.08),transparent 45%)}
.scene-frame::after{content:"";position:absolute;inset:auto 12% 9%;height:1px;background:linear-gradient(90deg,transparent,rgba(201,168,76,.6),transparent);box-shadow:0 0 30px rgba(201,168,76,.2)}
#escena{position:absolute;inset:0;display:block;width:100%;height:100%;z-index:2;pointer-events:none}
.scene-fallback{position:absolute;inset:0;display:grid;place-content:center;text-align:center;color:#625e54;z-index:1;transition:opacity .35s ease}
.scene-fallback::before{content:"";width:min(48vw,330px);aspect-ratio:1;border:1px solid rgba(201,168,76,.16);border-radius:50%;background:repeating-radial-gradient(circle,transparent 0 34px,rgba(201,168,76,.055) 35px 36px);margin:auto}
.scene-fallback span{margin-top:18px;font:400 9px/1.6 "IBM Plex Mono",monospace;letter-spacing:.18em;text-transform:uppercase}
.scene-ready .scene-fallback{opacity:0}
.scene-error #escena{display:none}

.print-rail{display:flex;gap:12px;align-items:center;justify-content:center;opacity:.28;transition:opacity .5s ease}
.scene-loading .print-rail,.scene-ready .print-rail{opacity:1}
.rail-track{position:relative;width:1px;height:min(46vh,330px);background:rgba(255,255,255,.1)}
.rail-fill{position:absolute;inset:0 0 auto;height:0;background:linear-gradient(var(--gold),#80692c);transition:height .12s linear}
.rail-head{position:absolute;top:0;left:-3px;width:7px;height:1px;background:#f1d980;box-shadow:0 0 9px var(--gold);transition:top .12s linear}
.rail-meta{align-self:center;min-width:54px;color:#7e796f;font:400 9px/1.7 "IBM Plex Mono",monospace;letter-spacing:.08em;text-transform:uppercase;font-variant-numeric:tabular-nums}
.rail-meta strong{display:block;color:var(--gold);font-weight:400;white-space:nowrap}
.rail-state{margin-top:12px;writing-mode:vertical-rl;letter-spacing:.18em;color:#8f897d}

.crumb-band{border-bottom:1px solid var(--line);background:#090909}
.crumb-band .crumbs{padding-block:16px}
.content-section{padding:clamp(64px,8vw,108px) 0;scroll-margin-top:calc(var(--nav-height) + var(--subnav-height) + 18px)}
.content-section.alt{background:#0c0c0c;border-block:1px solid var(--line)}
.section-intro{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.25fr);gap:clamp(32px,7vw,100px);align-items:start}
.content-section h2{max-width:13ch;margin:12px 0 0;font:500 clamp(40px,5vw,66px)/1 "Cormorant Garamond",serif;text-wrap:balance}
.section-copy{max-width:760px}
.section-copy>p:first-child{margin-top:0;color:#d5d0c5;font-size:clamp(17px,1.6vw,21px)}
.capability-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:46px}
.capability{min-height:210px;padding:28px;border:1px solid var(--line);background:#101010}
.capability h3{margin:13px 0 10px;font-size:17px}
.capability p{margin:0;color:var(--muted);font-size:14px}

.audience-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1px;background:var(--line);border:1px solid var(--line);margin-top:44px}
.audience-grid article{background:#080808;padding:30px}
.audience-grid h3{margin:0 0 12px;font:500 25px/1.1 "Cormorant Garamond",serif}
.audience-grid p{margin:0;color:var(--muted);font-size:14px}

.product-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-top:42px}
.product-card{display:flex;min-width:0;flex-direction:column;border:1px solid var(--line);background:#111;overflow:hidden}
.product-card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover;background:#0a0a0a}
.product-body{display:flex;flex:1;flex-direction:column;padding:22px}
.product-body h3{margin:10px 0;font:500 clamp(22px,2vw,29px)/1.05 "Cormorant Garamond",serif}
.product-body p{margin:0 0 22px;color:var(--muted);font-size:13px}
.product-link{margin-top:auto;color:var(--gold);text-decoration:none;font:500 10px/1.5 "IBM Plex Mono",monospace;letter-spacing:.1em;text-transform:uppercase}
.product-link::after{content:"  →"}
.catalog-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px}

.didactic-note{margin-top:50px;padding:22px 26px;border-left:2px solid var(--gold);background:rgba(201,168,76,.045);color:#c7c2b7}
.didactic-note strong{color:var(--text)}
.contact-panel{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center;padding:clamp(32px,5vw,58px);border:1px solid var(--line);background:radial-gradient(circle at 90% 20%,rgba(201,168,76,.12),transparent 38%),#0d0d0d}
.contact-panel h2{max-width:14ch}
.contact-panel p{max-width:720px;color:var(--muted)}
.contact-panel .actions{margin:0;justify-content:flex-end}

@media(max-width:1180px){
  .topbar .wrap{grid-template-columns:auto minmax(0,1fr)}
  .head-actions{display:none}
  .global-nav{justify-content:flex-start}
  .hero-grid{grid-template-columns:minmax(420px,1fr) minmax(330px,.78fr);gap-inline:40px}
  .product-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media(max-width:820px){
  :root{--nav-height:116px;--subnav-height:44px}
  .topbar .wrap{width:min(calc(100% - 28px),var(--division-max));display:grid;grid-template-columns:1fr;gap:9px;padding:11px 0 9px}
  .global-nav{width:100%;padding:0 0 3px}
  .hero-grid{width:min(calc(100% - 28px),var(--division-max));min-height:0;grid-template-columns:minmax(0,1fr);grid-template-rows:auto;grid-template-areas:"copy" "visual" "actions";gap:30px;padding:54px 0 58px}
  .hero-copy{align-self:auto}
  .hero-copy h1{font-size:clamp(48px,14vw,68px)}
  .hero-summary{font-size:17px;line-height:1.65}
  .hero-visual{grid-template-columns:minmax(0,1fr);min-height:380px}
  .scene-frame{min-height:380px}
  .print-rail{position:absolute;left:12px;top:28px;bottom:28px;z-index:4;gap:9px}
  .rail-track{height:100%}
  .rail-meta{font-size:8px}
  .rail-state{display:none}
  .hero-actions .btn{flex:1 1 210px}
  .section-intro{grid-template-columns:1fr;gap:24px}
  .capability-grid,.audience-grid{grid-template-columns:1fr}
  .capability{min-height:0}
  .contact-panel{grid-template-columns:1fr;gap:22px}
  .contact-panel .actions{justify-content:flex-start}
}

@media(max-width:560px){
  .product-grid{grid-template-columns:1fr}
  .scene-frame,.hero-visual{min-height:340px}
  .scene-fallback::before{width:250px}
  .content-section{padding:58px 0}
  .content-section h2{font-size:42px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .scene-fallback,.print-rail,.rail-fill,.rail-head{transition:none}
}
