/* ============================================================
   Regnum Global Supplies LLC — shared styles (multi-page)
   ============================================================ */
:root{
  --navy:#215D42; --navy-deep:#123526; --blue:#2E7A57; --steel:#5D6E64;
  --gold:#B49145; --gold-lt:#CDB27A; --gold-ink:#85682C;
  --ink:#182720; --body:#47534C; --muted:#636E66;
  --bg:#FFFFFF; --alt:#F6F4EE; --line:#E6E2D6; --line-dk:rgba(255,255,255,.16);
  --display:Georgia,'Times New Roman',serif; --sans:'Inter',system-ui,sans-serif; --mono:'IBM Plex Mono',ui-monospace,monospace;
  --ph-dark:grayscale(.3) brightness(.74) contrast(1.06) saturate(.85); --ph-lite:grayscale(.2) brightness(.94) contrast(1.04) saturate(.9);
  --pad:clamp(1.25rem,5vw,6rem); --sp:clamp(4.5rem,9vh,8rem);
  --ease-out:cubic-bezier(.22,1,.36,1); --ease-fric:cubic-bezier(.3,0,.55,1);
  --r:8px; --r-s:4px;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth;overflow-x:clip;scroll-padding-top:96px}
body{font-family:var(--sans);background:var(--bg);color:var(--ink);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:clip}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
::selection{background:var(--navy);color:#fff}
h1,h2,h3,h4{font-family:var(--display);font-weight:700;line-height:1.14;letter-spacing:-.004em;text-wrap:balance}
p{text-wrap:pretty}
:focus-visible{outline:2px solid var(--blue);outline-offset:3px;border-radius:2px}
:focus:not(:focus-visible){outline:none}
.wrap{max-width:1240px;margin:0 auto;padding-left:var(--pad);padding-right:var(--pad)}
.eyebrow{display:inline-flex;align-items:center;gap:.75rem;font-family:var(--sans);font-size:.72rem;font-weight:600;letter-spacing:.17em;text-transform:uppercase;color:var(--gold-ink)}
.eyebrow::before{content:"";width:26px;height:2px;background:var(--gold);flex:none}
.sec{padding-top:var(--sp);padding-bottom:var(--sp);position:relative}
.sec-head{max-width:58ch;margin-bottom:clamp(2rem,4.5vh,3.2rem)}
.sec-head h2{font-size:clamp(1.8rem,3.2vw,2.6rem);margin:.85rem 0 .95rem;color:var(--ink)}
.sec-head .lead{font-size:clamp(1rem,1.35vw,1.16rem);color:var(--body);line-height:1.65}
.alt{background:var(--alt)}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

/* reveals (sober) */
.js .rev{opacity:0;transform:translateY(14px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.js .rev.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.js .rev{transition:none;opacity:1;transform:none}*{scroll-behavior:auto!important}}

/* buttons: press physics */
.btn{display:inline-flex;align-items:center;gap:.55em;font-family:var(--sans);font-weight:600;font-size:.95rem;padding:.85em 1.5em;border-radius:var(--r-s);border:1px solid transparent;cursor:pointer;transition:.4s var(--ease-fric)}
.btn:hover{transition-duration:.22s}
.btn-solid{background:var(--navy);color:#fff;box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 1px 2px rgba(10,30,20,.25)}
.btn-solid:hover{background:var(--navy-deep);transform:translateY(-1px);box-shadow:inset 0 1px 0 rgba(255,255,255,.12),0 6px 16px -6px rgba(10,30,20,.4)}
.btn-ghost{border-color:var(--line);color:var(--ink);background:#fff}
.btn-ghost:hover{border-color:var(--navy);color:var(--navy)}
.btn-white{background:#fff;color:var(--navy)}
.btn-white:hover{background:#F3EFE5;transform:translateY(-1px)}
.btn:active{transform:translateY(1px);box-shadow:0 1px 2px rgba(10,30,20,.3);transition-duration:.07s}
.btn .arr{transition:transform .3s var(--ease-out)}
.btn:hover .arr{transform:translateX(3px)}
@media(prefers-reduced-motion:reduce){.btn:active,.btn-solid:hover,.btn-white:hover{transform:none}}

/* hero: CTA primario dorado (el dorado como acción solo aquí) */
.hero .btn-solid{background:var(--gold);border-color:var(--gold);color:var(--navy-deep);box-shadow:inset 0 1px 0 rgba(255,255,255,.28),0 1px 2px rgba(10,30,20,.35)}
.hero .btn-solid:hover{background:var(--gold-lt)}
.hero .btn-ghost{background:transparent;border-color:rgba(255,255,255,.38);color:#fff}
.hero .btn-ghost:hover{border-color:#fff}
/* ===== top utility bar ===== */
.topbar{background:var(--navy-deep);color:rgba(255,255,255,.78);font-size:.78rem}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;height:36px;gap:1rem}
.topbar .tb-l{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.topbar a{color:#fff;font-weight:500}
.topbar a:hover{text-decoration:underline;text-underline-offset:3px}

/* ===== header (solid, corporate) ===== */
header{position:sticky;top:0;z-index:90;background:rgba(255,255,255,.97);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.hd{display:flex;align-items:center;justify-content:space-between;height:76px;transition:height .45s var(--ease-out)}
header.scrolled .hd{height:62px;transition-duration:.25s}
.brand{display:flex;flex-direction:row;align-items:center;gap:.65rem;line-height:1}
.brand .bmark{height:46px;width:auto;transition:height .45s var(--ease-out)}
header.scrolled .brand .bmark{height:38px;transition-duration:.25s}
.brand .bstack{display:flex;flex-direction:column;gap:3px}
.brand .b1{font-family:Georgia,'Times New Roman',serif;font-weight:700;font-size:1.24rem;letter-spacing:.05em;color:var(--navy)}
.brand .b2{font-family:Georgia,'Times New Roman',serif;font-size:.56rem;letter-spacing:.3em;color:var(--gold);text-transform:uppercase}
.nav{display:flex;align-items:center;gap:1.7rem}
.nav>div{position:relative}
.nav a.lnk{display:inline-flex;align-items:center;gap:.35em;font-size:.92rem;font-weight:500;color:var(--body);padding:8px 0;position:relative}
.nav a.lnk::after{content:"";position:absolute;left:0;bottom:0;width:100%;height:2px;background:var(--navy);transform:scaleX(0);transform-origin:right;transition:transform .3s var(--ease-out)}
.nav a.lnk:hover{color:var(--navy)}
.nav a.lnk:hover::after,.nav a.lnk.cur::after{transform:scaleX(1);transform-origin:left}
.nav a.lnk.cur{color:var(--navy);font-weight:600}
.nav .car{width:8px;height:8px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);opacity:.55}
.dd{position:absolute;top:100%;left:-14px;padding-top:10px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.28s var(--ease-out)}
.nav>div:hover .dd,.nav>div:focus-within .dd{opacity:1;visibility:visible;transform:none}
.dd-in{background:#fff;border:1px solid var(--line);border-radius:6px;box-shadow:0 2px 3px -2px rgba(15,32,24,.15),0 18px 40px -20px rgba(15,32,24,.3);padding:.5rem;min-width:250px}
.dd a{display:block;padding:.6rem .8rem;border-radius:var(--r-s);font-size:.9rem;color:var(--body)}
.dd a b{display:block;font-weight:600;color:var(--ink);font-size:.92rem}
.dd a span{font-size:.78rem;color:var(--muted)}
.dd a:hover{background:var(--alt)}
.dd a:hover b{color:var(--navy)}
.nav .btn{padding:.62em 1.15em;font-size:.87rem}
.burger{display:none;flex-direction:column;gap:5px;background:none;border:0;cursor:pointer;padding:14px 10px;margin:-14px -10px;z-index:95}
.burger span{width:24px;height:2px;background:var(--navy);transition:translate .2s var(--ease-out) .1s,rotate .2s ease-in,scale .15s,opacity .15s,background .3s}
body.menu-open .burger span{background:#fff;transition:translate .18s var(--ease-fric),rotate .28s cubic-bezier(.34,1.56,.64,1) .14s,scale .15s,opacity .15s,background .3s}
body.menu-open .burger span:nth-child(1){translate:0 7px;rotate:45deg}
body.menu-open .burger span:nth-child(2){scale:0 1;opacity:0}
body.menu-open .burger span:nth-child(3){translate:0 -7px;rotate:-45deg}
.mmenu{position:fixed;inset:0;background:var(--navy-deep);z-index:80;display:flex;flex-direction:column;justify-content:flex-start;overflow-y:auto;gap:1.3rem;padding:var(--pad);transform:translateX(100%);transition:transform .55s var(--ease-out)}
.mmenu>:first-child{margin-top:auto}
.mmenu>:last-child{margin-bottom:auto}
.mmenu.open{transform:none}
.mmenu a{font-family:var(--display);font-size:1.6rem;font-weight:600;color:#fff}
.mmenu a.mcur{color:var(--gold-lt)}
@media(prefers-reduced-motion:no-preference){
 .mmenu>a{opacity:0;transform:translateX(26px);transition:opacity .35s ease,transform .5s cubic-bezier(.3,1.4,.4,1)}
 .mmenu.open>a{opacity:1;transform:none}
 .mmenu.open>a:nth-of-type(2){transition-delay:.05s}.mmenu.open>a:nth-of-type(3){transition-delay:.09s}
 .mmenu.open>a:nth-of-type(4){transition-delay:.13s}.mmenu.open>a:nth-of-type(5){transition-delay:.17s}
 .mmenu.open>a:nth-of-type(6){transition-delay:.21s}.mmenu.open>a:nth-of-type(7){transition-delay:.25s}
}
@media(prefers-reduced-motion:reduce){.mmenu{transition:none}.mmenu>a{opacity:1;transform:none}}

/* ===== interior page banner ===== */
.banner{position:relative;background:var(--navy-deep);color:#fff;overflow:clip}
.banner img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;opacity:.55;filter:var(--ph-dark)}
.banner::before{content:"";position:absolute;inset:0;background:linear-gradient(95deg,rgba(12,38,27,.92) 25%,rgba(12,38,27,.55) 70%,rgba(12,38,27,.4));z-index:1}
.banner .wrap{position:relative;z-index:2;padding-top:clamp(3.4rem,7vh,5.5rem);padding-bottom:clamp(3.4rem,7vh,5.5rem)}
.crumb{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.62)}
.crumb a:hover{color:#fff;text-decoration:underline;text-underline-offset:3px}
.crumb .sep{margin:0 .5em;opacity:.5}
.banner h1{font-size:clamp(2rem,4vw,3.1rem);margin-top:.9rem;max-width:22ch}
.banner .blead{margin-top:1rem;max-width:60ch;font-size:clamp(.98rem,1.3vw,1.14rem);color:rgba(255,255,255,.82);line-height:1.65}

/* ===== home hero ===== */
.hero{position:relative;background:var(--navy-deep);color:#fff;overflow:clip;display:flex;flex-direction:column;min-height:min(78vh,720px)}
.hero>.wrap{margin:auto 0;width:100%}
.hero-img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;filter:var(--ph-dark)}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(100deg,rgba(12,38,27,.9) 22%,rgba(12,38,27,.6) 58%,rgba(12,38,27,.42));z-index:1}
.hero .wrap{position:relative;z-index:2;padding-top:clamp(4.5rem,10vh,7.5rem);padding-bottom:clamp(3rem,7vh,5rem)}
.hero .eyebrow{color:var(--gold-lt)}
.hero h1{font-size:clamp(2.15rem,4.4vw,3.7rem);font-weight:700;max-width:18ch;margin:1.1rem 0 1.3rem;color:#fff}
.hero .sub{max-width:56ch;font-size:clamp(1rem,1.45vw,1.2rem);color:rgba(255,255,255,.85);line-height:1.65}
.hero .cta{display:flex;gap:.9rem;flex-wrap:wrap;margin-top:2rem}

/* ===== cards / grids ===== */
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1.1rem,2.2vw,1.8rem)}
.card{position:relative;overflow:hidden;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:1.7rem 1.6rem 1.5rem;box-shadow:0 1px 2px rgba(15,32,24,.06),0 12px 32px -18px rgba(15,32,24,0);transition:transform .55s var(--ease-fric),box-shadow .55s,border-color .55s;display:flex;flex-direction:column}
.card:hover{transform:translateY(-3px);border-color:#CDBF9B;box-shadow:0 1px 2px rgba(15,32,24,.02),0 12px 32px -18px rgba(15,32,24,.28);transition-duration:.28s}
.card .cn{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;color:var(--gold-ink);text-transform:uppercase}
.card h3,.card h2{font-size:1.22rem;margin:.65rem 0 .55rem}
.card p{font-size:.92rem;color:var(--body);line-height:1.6}
.card ul{list-style:none;margin-top:.9rem;border-top:1px solid var(--line)}
.card li{padding:.5rem 0;border-bottom:1px solid var(--line);font-size:.9rem;color:var(--body)}
.card .more{margin-top:auto;padding-top:1.1rem;font-family:var(--mono);font-size:.74rem;letter-spacing:.04em;color:var(--navy);font-weight:500}
.card .more .arr{display:inline-block;transition:transform .3s var(--ease-out)}
.card:hover .more .arr{transform:translateX(3px)}

/* photo cards (industries) */
.inds{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.ind{position:relative;border-radius:var(--r);overflow:hidden;background:var(--navy-deep);aspect-ratio:4/2.9;display:flex;align-items:flex-end;box-shadow:0 2px 3px -2px rgba(15,32,24,.35),0 16px 36px -22px rgba(15,32,24,0);transition:transform .55s var(--ease-fric),box-shadow .55s}
.ind:hover{transform:translateY(-3px);box-shadow:0 2px 3px -2px rgba(15,32,24,.12),0 16px 36px -22px rgba(15,32,24,.4);transition-duration:.28s}
.ind img{position:absolute;inset:0;width:100%!important;height:100%!important;object-fit:cover;filter:grayscale(1) brightness(.85) contrast(1.05);transition:filter .6s,transform .8s var(--ease-fric)}
.ind:hover img{filter:grayscale(.15) brightness(.9);transform:scale(1.035);transition-duration:.35s,.5s}
.ind::before{content:"";position:absolute;inset:0;background:linear-gradient(160deg,var(--navy),var(--navy-deep));mix-blend-mode:color;z-index:1;pointer-events:none}
.ind::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,38,27,.05) 30%,rgba(12,38,27,.82));z-index:1}
.ind .ind-in{position:relative;z-index:2;padding:1.25rem 1.35rem;width:100%}
.ind h3{color:#fff;font-size:1.2rem}
.ind p{color:rgba(255,255,255,.78);font-size:.84rem;margin-top:.3rem;line-height:1.5}

/* ===== service rows (capabilities page) ===== */
.grp{padding-top:clamp(2.6rem,5vh,4rem)}
.grp-h{display:flex;align-items:baseline;gap:1rem;border-bottom:2px solid var(--navy);padding-bottom:.9rem;margin-bottom:.4rem}
.grp-h .gn{font-family:var(--mono);font-size:.8rem;color:var(--gold-ink)}
.grp-h h2{font-size:clamp(1.4rem,2.4vw,1.9rem)}
.srv{display:grid;grid-template-columns:200px 1fr;gap:1.5rem;padding:1.5rem 0;border-bottom:1px solid var(--line);transition:background .4s}
.srv h3{font-size:1.12rem;line-height:1.3}
.srv .sn{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;color:var(--steel);display:block;margin-bottom:.45rem}
.srv p{font-size:.95rem;color:var(--body);line-height:1.65;max-width:64ch}
.srv ul{list-style:none;margin-top:.7rem;display:flex;flex-wrap:wrap;gap:.45rem}
.srv li{font-family:var(--mono);font-size:.72rem;color:var(--steel);border:1px solid var(--line);border-radius:99px;padding:.32em .8em;background:#fff}

/* ===== alternating feature rows ===== */
.feat{display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.8rem,4.5vw,4.5rem);align-items:center;padding:clamp(2rem,4.5vh,3.2rem) 0}
.feat+.feat{border-top:1px solid var(--line)}
.feat .ph{border-radius:var(--r);overflow:hidden;aspect-ratio:4/2.9;background:var(--navy-deep);box-shadow:0 2px 3px -2px rgba(15,32,24,.3),0 18px 40px -24px rgba(15,32,24,.35)}
.feat .ph img{width:100%!important;height:100%!important;object-fit:cover;filter:var(--ph-lite)}
.feat.rev-order .ph{order:2}
.feat h3,.feat h2{font-size:clamp(1.35rem,2.2vw,1.8rem);margin:.7rem 0 .8rem}
.feat p{color:var(--body);line-height:1.65;font-size:.98rem}
.feat ul{list-style:none;margin-top:1rem;border-top:1px solid var(--line)}
.feat li{padding:.55rem 0 .55rem 1.4rem;border-bottom:1px solid var(--line);font-size:.92rem;color:var(--body);position:relative}
.feat li::before{content:"";position:absolute;left:0;top:1.05em;width:14px;height:2px;background:var(--gold)}

/* ===== product categories ===== */
.pcat-block{border:1px solid var(--line);border-radius:var(--r);background:#fff;padding:1.7rem 1.7rem 1.5rem;transition:transform .55s var(--ease-fric),box-shadow .55s,border-color .55s;box-shadow:0 1px 2px rgba(15,32,24,.05)}
.pcat-block:hover{transform:translateY(-2px);border-color:#CDBF9B;box-shadow:0 10px 28px -18px rgba(15,32,24,.28);transition-duration:.28s}
.pcats{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.1rem,2.2vw,1.6rem)}
.pcat-block .cn{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;color:var(--gold-ink);text-transform:uppercase}
.pcat-block h3,.pcat-block h2{font-size:1.25rem;margin:.6rem 0 .5rem}
.pcat-block>p{font-size:.92rem;color:var(--body);line-height:1.6}
.chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1rem}
.chips span{font-family:var(--mono);font-size:.72rem;color:var(--body);border:1px solid var(--line);border-radius:99px;padding:.34em .85em;background:var(--alt)}

/* valve band */
.valve-band{background:var(--navy);color:#fff}
.valve-band .wrap{display:grid;grid-template-columns:1.2fr .8fr;gap:clamp(2rem,5vw,5rem);align-items:center;padding-top:clamp(3rem,6vh,4.5rem);padding-bottom:clamp(3rem,6vh,4.5rem)}
.valve-band h2{font-size:clamp(1.7rem,3vw,2.5rem);color:#fff}
.valve-band p{margin-top:1rem;color:rgba(255,255,255,.85);line-height:1.65;max-width:56ch}
.valve-band .vb-cta{justify-self:start}
@media(min-width:901px){.valve-band .vb-cta{justify-self:end}}

/* ===== process steps ===== */
.steps{display:grid;grid-template-columns:repeat(5,1fr);gap:clamp(1rem,2vw,1.7rem)}
.step{position:relative;padding-top:1.3rem;border-top:2px solid var(--line)}
.step::before{content:"";position:absolute;top:-2px;left:0;width:44px;height:2px;background:var(--navy)}
.step .sn{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;color:var(--steel)}
.step h3{font-size:1.1rem;margin:.5rem 0 .45rem}
.step p{font-size:.88rem;color:var(--body);line-height:1.55}

/* claim */
.claim{border-left:3px solid var(--navy);padding:.4rem 0 .4rem 1.6rem;max-width:62ch}
.claim p{font-family:var(--display);font-weight:500;font-size:clamp(1.12rem,1.7vw,1.4rem);line-height:1.45;color:var(--ink)}

/* values (about) */
.vals{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(1rem,2vw,1.5rem)}
.val{border-top:2px solid var(--line);padding-top:1.1rem;position:relative}
.val::before{content:"";position:absolute;top:-2px;left:0;width:34px;height:2px;background:var(--gold)}
.val .vn{font-family:var(--mono);font-size:.68rem;color:var(--steel)}
.val h3{font-size:1.05rem;margin:.45rem 0 .35rem}
.val p{font-size:.88rem;color:var(--body);line-height:1.55}

/* triad */
.triad{margin-top:1.8rem;border-top:1px solid var(--line)}
.triad div{display:flex;gap:.9rem;align-items:baseline;padding:.75rem 0;border-bottom:1px solid var(--line)}
.triad .tn{font-family:var(--mono);font-size:.72rem;color:var(--gold-ink)}
.triad b{font-weight:600;color:var(--ink);font-size:.97rem}

/* quality cards */
.qual-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:clamp(1.1rem,2.2vw,1.7rem)}

/* ===== CTA band (pre-footer) ===== */
.ctaband{background:var(--navy-deep);color:#fff}
.ctaband .wrap{display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap;padding-top:clamp(2.8rem,5vh,4rem);padding-bottom:clamp(2.8rem,5vh,4rem)}
.ctaband h2{font-size:clamp(1.5rem,2.6vw,2.2rem);color:#fff;max-width:24ch}
.ctaband p{color:rgba(255,255,255,.75);margin-top:.5rem;max-width:52ch}

/* ===== contact ===== */
.con-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(2rem,5vw,5rem)}
.cinfo .ci{border-bottom:1px solid var(--line);padding:1.05rem 0}
.cinfo .ci .l{font-family:var(--mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--steel)}
.cinfo .ci .v{display:block;font-size:1.02rem;color:var(--ink);margin-top:.35rem;overflow-wrap:anywhere}
.cinfo .ci a.v:hover{color:var(--blue)}
.form{background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.5rem,3vw,2.2rem);box-shadow:0 1px 2px rgba(15,32,24,.05),0 18px 44px -26px rgba(15,32,24,.18)}
.form .fl{display:block;font-family:var(--mono);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:var(--steel);margin:1.05rem 0 .4rem}
.form .fl:first-child{margin-top:0}
.form input,.form select,.form textarea{width:100%;background:#fff;border:1px solid var(--line);border-radius:var(--r-s);padding:.75em .85em;color:var(--ink);font-family:var(--sans);font-size:1rem;transition:border-color .3s,box-shadow .3s}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--blue);box-shadow:0 0 0 3px rgba(46,122,87,.14)}
.form select{appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M1 1l4 4 4-4' stroke='%236E8177' fill='none' stroke-width='1.5'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .85em center;padding-right:2.3em}
.form textarea{resize:vertical;min-height:120px}
.form button{margin-top:1.5rem;width:100%;justify-content:center}
.form .sent{display:none;font-family:var(--mono);font-size:.8rem;color:var(--blue);margin-top:1rem;text-align:center}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:0 1.2rem}

/* ===== footer ===== */
footer{background:var(--navy-deep);color:rgba(255,255,255,.75);padding:3.2rem 0 2.2rem}
.ft{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1.1fr;gap:2rem;padding-bottom:2.4rem;border-bottom:1px solid var(--line-dk)}
.ft .brand .b1{color:#fff}
.ft .brand .b2{color:var(--gold-lt)}
.ft .brand .bmark{height:52px}
.ft p.tag{font-size:.9rem;line-height:1.6;margin-top:1rem;max-width:34ch;color:rgba(255,255,255,.66)}
.ft .fh{font-family:var(--mono);font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.55);margin-bottom:1rem}
.ft a{display:block;font-size:.92rem;margin-bottom:.55rem;color:rgba(255,255,255,.78)}
.ft a:hover{color:#fff}
.fb{display:flex;justify-content:space-between;flex-wrap:wrap;gap:1rem;margin-top:1.8rem;font-size:.78rem;color:rgba(255,255,255,.5)}

/* ===== responsive ===== */
@media(max-width:1000px){
  .cards3,.inds,.vals{grid-template-columns:repeat(2,1fr)}
  .pcats{grid-template-columns:1fr}
  .steps{grid-template-columns:repeat(2,1fr);gap:1.5rem 1.3rem}
  .feat,.con-grid,.valve-band .wrap{grid-template-columns:1fr}
  .feat.rev-order .ph{order:0}
  .qual-grid{grid-template-columns:1fr}
  .ft{grid-template-columns:1fr 1fr}
  .srv{grid-template-columns:1fr;gap:.5rem}
}
@media(max-width:900px){
  .nav>div,.nav>a.lnk,.nav>.btn{display:none}
  .burger{display:flex}
  .topbar .tb-l{display:none}
  .topbar .wrap{justify-content:flex-end}
}
@media(max-width:560px){
  .cards3,.inds,.steps,.vals{grid-template-columns:1fr}
  .ft{grid-template-columns:1fr}
  .grid2{grid-template-columns:1fr}
}
@media print{
  .topbar,header,.burger,.mmenu,.ctaband{display:none!important}
  .rev{opacity:1!important;transform:none!important}
}

/* ===== mejora total: profundidad y ritmo ===== */
.ghostn{position:absolute;right:.9rem;top:-.4rem;font-family:var(--display);font-weight:700;font-size:5rem;line-height:1;color:#F1ECDF;pointer-events:none;user-select:none}
.card>*{position:relative}
.card .ghostn{z-index:0}
.grp{position:relative}
.grp .ghostn{font-size:7rem;top:1.2rem;right:0;color:#EFE9DA}
.inds .ind:first-child{grid-column:span 2}
@media(max-width:560px){.inds .ind:first-child{grid-column:auto}}
.valve-band{position:relative;overflow:clip}

.valve-band .wrap{position:relative;z-index:1}
.ctaband{border-top:3px solid var(--gold)}
.banner h1::before{content:"";display:block;width:40px;height:2px;background:var(--gold);margin-bottom:1.1rem}
.step::before{background:var(--gold)}
.ft .fh{color:var(--gold-lt)}
.sec-head h2{margin-top:1.05rem}

/* ===== auditoría total: componentes nuevos ===== */
.hero-strip{position:relative;z-index:2;margin-top:auto;border-top:1px solid rgba(255,255,255,.14);background:rgba(9,28,20,.55);backdrop-filter:blur(6px)}
.hero-strip .wrap{display:flex;align-items:center;gap:1.5rem;padding-top:.95rem;padding-bottom:.95rem;flex-wrap:wrap}
.hero-strip .hs-l{font-family:var(--mono);font-size:.64rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-lt);flex:none}
.hero-strip nav{display:flex;flex-wrap:wrap;gap:.4rem 1.4rem}
.hero-strip a{font-size:.85rem;font-weight:500;color:rgba(255,255,255,.82)}
.hero-strip a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--gold)}
.skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--navy-deep);color:#fff;padding:.7em 1.2em;border-radius:0 0 6px 0;font-size:.85rem;font-weight:600}
.skip:focus{left:0}
.xlinks{margin-top:1.1rem;display:flex;flex-wrap:wrap;gap:.5rem 1.4rem}
.xlinks a{font-family:var(--mono);font-size:.76rem;color:var(--navy);font-weight:500}
.xlinks a .arr{display:inline-block;transition:transform .3s var(--ease-out)}
.xlinks a:hover .arr{transform:translateX(3px)}
.vb-triad{margin-top:1.6rem;border-top:1px solid var(--line-dk);max-width:44ch}
.vb-triad div{display:flex;gap:.9rem;align-items:baseline;padding:.7rem 0;border-bottom:1px solid var(--line-dk)}
.vb-triad .tn{font-family:var(--mono);font-size:.72rem;color:var(--gold-lt)}
.vb-triad b{color:#fff;font-weight:600;font-size:.97rem}
.cta-alt{margin-top:.9rem;font-size:.85rem;color:rgba(255,255,255,.6)}
.cta-alt a{color:var(--gold-lt);text-decoration:underline;text-underline-offset:3px}
.cta-alt a:hover{color:#fff}
.docman{border:1px solid var(--line);border-radius:var(--r);background:#fff;overflow:hidden;margin-top:clamp(2rem,4vh,3rem)}
.dm-h{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-ink);padding:1rem 1.4rem;border-bottom:2px solid var(--navy)}
.docman table{width:100%;border-collapse:collapse}
.docman td{padding:.85rem 1.4rem;border-top:1px solid var(--line);font-size:.92rem;color:var(--body)}
.docman tr:first-child td{border-top:0}
.docman tr td:first-child{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--gold-ink);width:5.5rem}
.docman tr td:last-child{font-family:var(--mono);font-size:.74rem;color:var(--steel);text-align:right}
.faq{margin-top:clamp(2rem,4vh,3rem);border-top:1px solid var(--line)}
.fq{border-bottom:1px solid var(--line)}
.fq summary{cursor:pointer;padding:1.05rem 0;font-weight:700;font-family:var(--display);font-size:1.05rem;list-style:none;position:relative;padding-right:2rem;color:var(--ink)}
.fq summary::-webkit-details-marker{display:none}
.fq summary::before,.fq summary::after{content:"";position:absolute;right:.3rem;top:50%;width:12px;height:2px;background:var(--gold);translate:0 -50%;transition:rotate .4s cubic-bezier(.34,1.56,.64,1)}
.fq summary::after{rotate:90deg}
.fq[open] summary::after{rotate:0deg}
@supports(interpolate-size:allow-keywords){
 :root{interpolate-size:allow-keywords}
 .fq::details-content{block-size:0;overflow:clip;transition:block-size .45s var(--ease-out),content-visibility .45s allow-discrete}
 .fq[open]::details-content{block-size:auto}
}
@media(prefers-reduced-motion:reduce){.fq summary::before,.fq summary::after{transition:none}.fq::details-content{transition:none}}
.fq p{padding:0 0 1.1rem;color:var(--body);font-size:.95rem;line-height:1.65;max-width:70ch}
.nxt{margin-top:1.6rem}
.nx-h{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-ink);margin-bottom:.7rem}
.nxt ol{list-style:none;counter-reset:nx}
.nxt ol li{counter-increment:nx;position:relative;padding:.55rem 0 .55rem 2.2rem;border-bottom:1px solid var(--line);font-size:.92rem;color:var(--body);line-height:1.55}
.nxt ol li::before{content:"0" counter(nx);position:absolute;left:0;top:.68rem;font-family:var(--mono);font-size:.7rem;color:var(--gold-ink)}
.nxt ol li b{color:var(--ink)}
.nx-p{font-size:.92rem;color:var(--body);line-height:1.6}
.fnote{margin-top:.8rem;font-size:.78rem;color:var(--muted);line-height:1.5}
.fnote a{color:var(--navy);text-decoration:underline;text-underline-offset:2px}
.alt-mail{margin-top:.9rem;font-size:.85rem;color:var(--body);text-align:center}
.alt-mail a{color:var(--navy);font-weight:600;text-decoration:underline;text-underline-offset:2px}
.form ::placeholder{color:var(--muted);opacity:1}
.form input:hover,.form select:hover,.form textarea:hover{border-color:#CDBF9B}
.form input:user-invalid,.form select:user-invalid,.form textarea:user-invalid{border-color:#A3543A;box-shadow:0 0 0 3px rgba(163,84,58,.12)}
.bnav{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1.4rem}
.bnav a{font-family:var(--mono);font-size:.7rem;letter-spacing:.08em;color:rgba(255,255,255,.85);border:1px solid rgba(255,255,255,.28);border-radius:99px;padding:.45em 1em;transition:.25s}
.bnav a:hover{border-color:var(--gold-lt);color:var(--gold-lt)}
.dd-in.dd-2col{display:grid;grid-template-columns:1fr 1fr;min-width:470px}
.pc-cta{display:inline-flex;gap:.4em;margin-top:1.1rem;font-family:var(--mono);font-size:.76rem;color:var(--navy);font-weight:500}
.pc-cta:hover{color:var(--gold-ink)}
.pc-cta .arr{display:inline-block;transition:transform .3s var(--ease-out)}
.pc-cta:hover .arr{transform:translateX(3px)}
.feat--lead h2{font-size:clamp(1.8rem,3vw,2.5rem);margin:.7rem 0 .9rem;letter-spacing:-.01em}
.feat .ph{position:relative}
.feat .ph::after{content:"";position:absolute;inset:10px;border:1px solid rgba(246,244,238,.4);border-radius:3px;pointer-events:none;mix-blend-mode:overlay}
.srv{padding:1.5rem 1.25rem;margin-left:-1.25rem;margin-right:-1.25rem;border-radius:6px}
.srv:hover{background:linear-gradient(90deg,var(--alt) 0%,transparent 75%);transition-duration:.25s}
.srv:hover .sn{color:var(--gold-ink)}
.srv h3{transition:color .3s}
.srv:hover h3{color:var(--navy)}
body.menu-open{overflow:hidden}
.btn-m{display:none}
.ft a{transition:color .25s}
.ft a:hover{color:#fff;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--gold)}
footer{position:relative;overflow:clip}
footer::after{content:"";position:absolute;right:-70px;bottom:-70px;width:320px;height:320px;background:url(img/regnum-mark-light.svg) center/contain no-repeat;opacity:.05;pointer-events:none}
.msub{display:flex;flex-direction:column;gap:.55rem;margin:-.4rem 0 .2rem 1.2rem}
.msub a{font-family:var(--sans);font-size:.95rem;font-weight:500;color:rgba(255,255,255,.72)}
@media(max-width:900px){
 .nav>.btn-m{display:inline-flex;padding:.5em .95em;font-size:.8rem}
 .hero-strip nav{gap:.35rem .9rem}
 .dd-in.dd-2col{min-width:0;grid-template-columns:1fr}
}
@media(max-width:400px){.brand .b2{display:none}}
@media print{
 footer{background:#fff;color:#123526}
 .ft-monument,.grain{display:none}
 .ft a,.fb,.ft p.tag,.ft .brand .b1,.ft div>p{color:#123526!important}
 footer::after{display:none}
 .hero-strip{display:none}
 .valve-band{background:#fff!important;color:#123526!important;border-top:2px solid #E6E2D6}
 .valve-band h2,.valve-band p,.vb-triad b{color:#123526!important}
 .vb-triad .tn{color:#85682C!important}
 .vb-mark{display:none}
 .vb-triad,.vb-triad div{border-color:#E6E2D6!important}
}

.form [hidden]{display:none!important}
html:not(.js) .burger{display:none}

/* ===== SMS consent (A2P/10DLC) ===== */
.sms-consent{display:flex;flex-direction:column;gap:.7rem;margin:.2rem 0 .5rem;padding:.9rem 1rem;background:var(--alt);border:1px solid var(--line);border-radius:var(--r-s)}
.sms-check{display:flex;gap:.6rem;align-items:flex-start;font-size:.82rem;color:var(--body);line-height:1.55;cursor:pointer}
.sms-check input{margin-top:.2em;width:15px;height:15px;flex:none;accent-color:var(--navy)}
.sms-check a{color:var(--blue);text-decoration:underline;text-underline-offset:2px}
.sms-box{max-height:8.5rem;overflow-y:auto;background:#fff;border:1px solid var(--line);border-radius:var(--r-s);padding:.7rem .85rem;font-size:.76rem;color:var(--muted);line-height:1.55}
.sms-box p+p{margin-top:.5rem}
.sms-box b{color:var(--ink);font-size:.7rem;letter-spacing:.1em}

/* ============================================================
   NIVEL A — sistema de motion (panel de editores, jul-2026)
   ============================================================ */

/* --- grano de película en bandas oscuras --- */
.grain{position:absolute;inset:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:180px;opacity:.05;mix-blend-mode:overlay;pointer-events:none;z-index:1}
.ctaband{position:relative;overflow:clip}
.ctaband .wrap{position:relative;z-index:2}
footer>.wrap{position:relative;z-index:1}

/* --- retícula hexagonal técnica en bandas marfil --- */
.hexed::before{content:"";position:absolute;inset:0;z-index:0;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97'%3E%3Cpath d='M28 2 52 16v28L28 58 4 44V16Z' fill='none' stroke='%23DCD5C0' stroke-width='.8'/%3E%3C/svg%3E"),url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='56' height='97'%3E%3Cpath d='M28 2 52 16v28L28 58 4 44V16Z' fill='none' stroke='%23DCD5C0' stroke-width='.8'/%3E%3C/svg%3E");background-size:56px 97px,56px 97px;background-position:0 0,28px 48px;mask-image:radial-gradient(130% 100% at 50% 40%,transparent 34%,#000 90%);-webkit-mask-image:radial-gradient(130% 100% at 50% 40%,transparent 34%,#000 90%)}
.hexed>.wrap{position:relative;z-index:1}

/* --- ruta del integrador (hero) --- */
.hero-img{object-position:center bottom}
.hero h1 .hl{display:block}
.hero .cta .btn{position:relative}

/* --- apertura de la home: una vez por sesión (html.intro) --- */
@media(prefers-reduced-motion:no-preference){
 .intro .hero-img,.intro .hero .grain{animation:hIn .9s var(--ease-out) both}
 .intro .hero .eyebrow{opacity:0;animation:hFade .5s ease .12s forwards}
 .intro .hero .eyebrow::before{transform:scaleX(0);transform-origin:left;animation:hBar .3s var(--ease-out) .16s forwards}
 .intro .hero .hl{overflow:clip;padding-bottom:.09em;margin-bottom:-.09em}
 .intro .hero .hl>span{display:inline-block;transform:translateY(112%);animation:hLine .62s cubic-bezier(.2,.9,.27,1.04) .22s forwards}
 .intro .hero .hl:nth-child(2)>span{animation-delay:.34s}
 .intro .hero .sub{opacity:0;animation:hUp .6s var(--ease-out) .54s forwards}
 .intro .hero .cta .btn{opacity:0;animation:hBtn .5s cubic-bezier(.34,1.56,.64,1) .64s forwards}
 .intro .hero .cta .btn:nth-child(2){animation-delay:.72s}
 .intro .hero-strip{transform:translateY(100%);animation:hStrip .38s var(--ease-out) .78s forwards}
 .intro .hero .cta .btn-solid::after{content:"";position:absolute;inset:-4px;border:2px solid var(--gold-lt);border-radius:7px;opacity:0;animation:hRing .55s ease-out 1.12s}
}
@keyframes hIn{from{opacity:0;transform:scale(1.055)}to{opacity:1;transform:none}}
@keyframes hFade{to{opacity:1}}
@keyframes hBar{to{transform:scaleX(1)}}
@keyframes hLine{to{transform:none}}
@keyframes hUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes hBtn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes hStrip{to{transform:none}}
@keyframes hRing{0%{opacity:0;transform:scale(.94)}30%{opacity:.9}100%{opacity:0;transform:scale(1.12)}}

/* --- salida del hero en profundidad (scrubbed) --- */
@supports(animation-timeline:view()){
 @media(prefers-reduced-motion:no-preference){
  .hero-img,.hero .grain{animation:hxImg linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
  .intro .hero-img,.intro .hero .grain{animation:hIn .9s var(--ease-out) both,hxImg linear both;animation-timeline:auto,view();animation-range:normal,exit 0% exit 100%}
  .hero>.wrap{animation:hxCopy linear both;animation-timeline:view();animation-range:exit 0% exit 55%}
 }
}
@keyframes hxImg{to{transform:translateY(11%) scale(1.07)}}
@keyframes hxCopy{to{transform:translateY(-7%);opacity:.2}}

/* --- vocabulario de reveals v2 --- */
@media(prefers-reduced-motion:no-preference){
 .js .sec-head.rev .eyebrow::before{transform:scaleX(0);transform-origin:left;transition:transform .55s var(--ease-out) .12s}
 .js .sec-head.rev.in .eyebrow::before{transform:scaleX(1)}
}
@media(prefers-reduced-motion:no-preference){
 .js .card.rev.in,.js .pcat-block.rev.in{animation:cardSpring .7s cubic-bezier(.3,1.4,.4,1) backwards}
 .js .ind.rev{opacity:1;transform:none}
 .js .ind.rev:hover{transform:translateY(-3px)}
 .js .ind.rev img,.js .ind.rev .ind-in{clip-path:inset(0 100% 0 0)}
 .js .ind.rev img{transform:scale(1.07)}
 .js .ind.rev.in img{clip-path:inset(0 0 0 0);transform:none;transition:clip-path .8s var(--ease-out),transform 1.1s var(--ease-out),filter .6s}
 .js .ind.rev.in .ind-in{clip-path:inset(0 0 0 0);transition:clip-path .8s var(--ease-out)}
 .js .ind.rev.in:hover img{transform:scale(1.035);transition:clip-path .8s var(--ease-out),filter .35s,transform .5s var(--ease-fric)}
}
@keyframes cardSpring{0%{opacity:0;transform:translateY(18px)}70%{opacity:1;transform:translateY(-2px)}100%{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.js .ind.rev img,.js .ind.rev .ind-in{clip-path:none}}

/* --- parallax scrubbed en banners interiores + filete que se dibuja --- */
@supports(animation-timeline:view()){
 @media(prefers-reduced-motion:no-preference){
  .banner img{transform:scale(1.12);animation:bnDrift linear both;animation-timeline:view();animation-range:exit 0% exit 100%}
 }
}
@keyframes bnDrift{from{transform:scale(1.12)}to{transform:scale(1.12) translateY(-6%)}}
@media(prefers-reduced-motion:no-preference){
 .js .banner h1::before{transform:scaleX(0);transform-origin:left;animation:blDraw .8s var(--ease-out) .15s forwards}
}
@keyframes blDraw{to{transform:scaleX(1)}}

/* --- costuras vivas: filete del ctaband se dibuja al llegar --- */
.js .ctaband.rev{opacity:1;transform:none}
.js .ctaband{border-top:0}
.js .ctaband::before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform 1.1s var(--ease-out);z-index:2}
.js .ctaband.rev.in::before{transform:scaleX(1)}
html:not(.js) .ctaband{border-top:3px solid var(--gold)}
@media(prefers-reduced-motion:reduce){.js .ctaband::before{transform:scaleX(1);transition:none}}

/* --- deriva de la marca de agua del valve-band (scrubbed) --- */
@supports(animation-timeline:view()){
 @media(prefers-reduced-motion:no-preference){
  .vb-mark{animation:markDrift linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
 }
}
@keyframes markDrift{from{transform:translateY(-46%) rotate(-5deg)}to{transform:translateY(-54%) rotate(5deg)}}

/* --- barra de progreso de lectura --- */
#sprog{position:fixed;top:0;left:0;width:100%;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;z-index:120;pointer-events:none}
@supports(animation-timeline:scroll()){#sprog{animation:sprogGrow linear both;animation-timeline:scroll()}}
@keyframes sprogGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media print{#sprog{display:none}}

/* --- física de nav: underline whip, flechas nudge, dropdown spring --- */
@media(prefers-reduced-motion:no-preference){
 .nav a.lnk:hover:not(.cur)::after{animation:uLand .38s cubic-bezier(.3,.7,.4,1) both}
 .btn:hover .arr,.card:hover .more .arr,.xlinks a:hover .arr,.pc-cta:hover .arr{animation:arrNudge .32s var(--ease-out) both}
 .nav .car{transition:transform .45s cubic-bezier(.34,1.56,.64,1)}
 .nav>div:hover .car{transform:rotate(225deg) translateY(1px)}
 .nav>div:hover .dd,.nav>div:focus-within .dd{animation:ddLand .42s cubic-bezier(.3,.9,.35,1) both}
 .nav>div:hover .dd-in a,.nav>div:focus-within .dd-in a{opacity:0;animation:ddItem .3s var(--ease-out) forwards}
 .nav>div:hover .dd-in a:nth-child(2),.nav>div:focus-within .dd-in a:nth-child(2){animation-delay:.04s}
 .nav>div:hover .dd-in a:nth-child(3),.nav>div:focus-within .dd-in a:nth-child(3){animation-delay:.08s}
 .nav>div:hover .dd-in a:nth-child(4),.nav>div:focus-within .dd-in a:nth-child(4){animation-delay:.12s}
 .nav>div:hover .dd-in a:nth-child(5),.nav>div:focus-within .dd-in a:nth-child(5){animation-delay:.16s}
 .nav>div:hover .dd-in a:nth-child(6),.nav>div:focus-within .dd-in a:nth-child(6){animation-delay:.2s}
}
@keyframes uLand{0%{transform:scaleX(0)}70%{transform:scaleX(1.06)}100%{transform:scaleX(1)}}
@keyframes arrNudge{0%{transform:none}55%{transform:translateX(4.5px)}100%{transform:translateX(3px)}}
@keyframes ddLand{0%{opacity:0;transform:translateY(12px)}60%{opacity:1;transform:translateY(-3px)}82%{transform:translateY(1px)}100%{opacity:1;transform:none}}
@keyframes ddItem{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* ============================================================
   NIVEL B — piezas editoriales (panel de editores, jul-2026)
   ============================================================ */

/* --- aperturas de sección XL con folio --- */
.sec-head--xl{max-width:none}
.sec-head--xl h2{font-size:clamp(2.1rem,4vw,3.3rem);line-height:1.08;letter-spacing:-.012em;max-width:22ch}
.folio{display:flex;width:100%;align-items:center}
.folio::after{content:"";flex:1;height:1px;background:var(--line);margin-left:1.1rem}
@media(prefers-reduced-motion:no-preference){
 .js .sec-head.rev .folio::after{transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease-out) .25s}
 .js .sec-head.rev.in .folio::after{transform:scaleX(1)}
}
@media(min-width:1000px){
 .sec-head--xl{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:0 3rem;align-items:end}
 .sec-head--xl .folio{grid-column:1/-1;margin-bottom:1rem}
 .sec-head--xl h2{margin:0}
 .sec-head--xl .lead{border-top:1px solid var(--line);padding-top:1rem}
}

/* --- capabilities como ledger: reglas que se dibujan + ghost drift --- */
.js .grp-h{border-bottom:0;position:relative}
.js .grp-h::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--navy)}
.js .srv{border-bottom:0}
.js .srv::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line)}
.srv{position:relative}
@media(prefers-reduced-motion:no-preference){
 .js .grp-h::after{transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease-out)}
 .js .grp-h.rev.in::after{transform:scaleX(1)}
 .js .srv::after{transform:scaleX(0);transform-origin:left;transition:transform .7s var(--ease-out) .15s}
 .js .srv.rev.in::after{transform:scaleX(1)}
}
@supports(animation-timeline:view()){
 @media(prefers-reduced-motion:no-preference) and (min-width:1000px){
  .grp .ghostn{animation:ghostDrift linear both;animation-timeline:view();animation-range:cover 0% cover 100%}
 }
}
@keyframes ghostDrift{from{transform:translateY(46px)}to{transform:translateY(-46px)}}

/* --- docman: cascada + asiento contable en hover --- */
@media(prefers-reduced-motion:no-preference){
 .js .docman tr.rev{opacity:0;transform:none;transition:none}
 .js .docman tr.rev.in{opacity:1;animation:rowIn .55s var(--ease-out) backwards}
 .js .docman tr.rev.in:nth-child(2){animation-delay:.09s}
 .js .docman tr.rev.in:nth-child(3){animation-delay:.18s}
 .js .docman tr.rev.in:nth-child(4){animation-delay:.27s}
 .js .docman tr.rev.in:nth-child(5){animation-delay:.36s}
}
@media(prefers-reduced-motion:reduce){.js .docman tr.rev{opacity:1;transform:none}}
@keyframes rowIn{from{opacity:0}to{opacity:1}}
.docman tbody tr,.docman tr{transition:background .35s}
.docman tr:hover{background:linear-gradient(90deg,var(--alt),transparent 75%)}
.docman td:first-child{position:relative}
.docman td:first-child::after{content:"";position:absolute;left:1.4rem;bottom:.55rem;width:0;height:2px;background:var(--gold);transition:width .3s var(--ease-out)}
.docman tr:hover td:first-child::after{width:2.4rem}

/* --- espina del proceso: línea dorada + nodos spring --- */
.js .steps.rev{opacity:1;transform:none}
.steps{position:relative}
.js .steps.rev::before{content:"";position:absolute;top:0;left:0;right:0;height:2px;background:var(--gold);transform:scaleX(0);transform-origin:left;z-index:1}
.js .steps.rev .step::before{display:none}
.js .steps.rev .step::after{content:"";position:absolute;top:-5px;left:0;width:8px;height:8px;border-radius:50%;background:var(--gold);box-shadow:0 0 0 3px rgba(180,145,69,.18);transform:scale(0)}
@media(prefers-reduced-motion:no-preference){
 .js .steps.rev.in::before{animation:spineDraw 1.4s var(--ease-out) both}
 .js .steps.rev.in .step::after{animation:stepPop .45s cubic-bezier(.34,1.56,.64,1) both}
 .js .steps.rev.in .step:nth-child(1)::after{animation-delay:.08s}
 .js .steps.rev.in .step:nth-child(2)::after{animation-delay:.36s}
 .js .steps.rev.in .step:nth-child(3)::after{animation-delay:.64s}
 .js .steps.rev.in .step:nth-child(4)::after{animation-delay:.92s}
 .js .steps.rev.in .step:nth-child(5)::after{animation-delay:1.2s}
}
@media(prefers-reduced-motion:reduce){
 .js .steps.rev::before{transform:scaleX(1)}
 .js .steps.rev .step::after{transform:scale(1)}
}
@keyframes spineDraw{to{transform:scaleX(1)}}
@keyframes stepPop{0%{transform:scale(0)}62%{transform:scale(1.35)}82%{transform:scale(.92)}100%{transform:scale(1)}}
@media(max-width:560px){
 .js .steps.rev::before{width:2px;height:100%;right:auto;transform:scaleY(0);transform-origin:top}
 @media(prefers-reduced-motion:reduce){.js .steps.rev::before{transform:scaleY(1)}}
 .js .steps.rev .step::after{top:-2px;left:-3px}
 .js .steps.rev .step{padding-left:1.1rem}
 @media(prefers-reduced-motion:no-preference){.js .steps.rev.in::before{animation-name:spineDrawY}}
}
@keyframes spineDrawY{to{transform:scaleY(1)}}

/* --- pull-quotes con entintado palabra a palabra --- */
.pq-band{padding:clamp(2.6rem,6.5vh,4.5rem) 0;background:#fff}
.pq{position:relative;font-family:var(--display);font-weight:500;font-size:clamp(1.45rem,2.5vw,2.2rem);line-height:1.4;color:var(--ink);max-width:26ch;margin-left:clamp(2.5rem,12vw,11rem);text-wrap:balance}
.pq::before{content:"";position:absolute;left:-3.3rem;top:.6em;width:2.3rem;height:3px;background:var(--gold)}
.js .pq.rev{opacity:1;transform:none}
.js .pq span{opacity:.2;transition:opacity .5s ease;transition-delay:calc(var(--i)*50ms)}
.js .pq.in span{opacity:1}
@media(prefers-reduced-motion:reduce){.js .pq span{opacity:1;transition:none}}

/* --- footer monumental + reloj de operaciones --- */
.ft-monument{font-family:var(--display);font-weight:700;font-size:clamp(3.2rem,13.5vw,11rem);line-height:.8;letter-spacing:.06em;text-align:center;color:rgba(205,178,122,.055);-webkit-text-stroke:1px rgba(205,178,122,.2);margin:2.6rem auto -.235em;pointer-events:none;user-select:none}
@supports(animation-timeline:view()){
 @media(prefers-reduced-motion:no-preference){
  .ft-monument{animation:monuRise linear both;animation-timeline:view();animation-range:entry 0% entry 90%}
 }
}
@keyframes monuRise{from{transform:translateY(52px);opacity:.4}to{transform:none;opacity:1}}
.est{font-family:var(--mono);font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(255,255,255,.56)}

/* --- el mark se dibuja a sí mismo en la valve-band --- */
.js .valve-band.rev{opacity:1;transform:none}
.vb-mark{position:absolute;right:-70px;top:50%;transform:translateY(-50%);width:420px;height:420px;opacity:.14;pointer-events:none}
@media(prefers-reduced-motion:no-preference){
 .js .vb-mark :is(path,line){stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 1.2s var(--ease-out)}
 .js .vb-mark .mk-h2{transition-delay:.15s}
 .js .vb-mark .mk-b{transition-delay:.35s;transition-duration:.6s}
 .js .vb-mark .mk-c1{transition-delay:.5s}
 .js .vb-mark .mk-c2{transition-delay:.7s}
 .js .valve-band.rev.in .vb-mark :is(path,line){stroke-dashoffset:0}
 .js .vb-mark .mk-dot{transform:scale(0);transform-box:fill-box;transform-origin:center;transition:transform .5s cubic-bezier(.34,1.56,.64,1) 1.3s}
 .js .valve-band.rev.in .vb-mark .mk-dot{transform:scale(1)}
}

/* --- formulario vivo (contact) --- */
.fl::before{content:"";display:inline-block;width:0;height:2px;background:var(--gold);vertical-align:.28em;transition:width .35s cubic-bezier(.34,1.56,.64,1),margin-right .35s cubic-bezier(.34,1.56,.64,1)}
.form div:focus-within>.fl,.form label.fl:has(+select:focus),.form label.fl:has(+textarea:focus){color:var(--gold-ink)}
.form div:focus-within>.fl::before,.form label.fl:has(+select:focus)::before,.form label.fl:has(+textarea:focus)::before{width:16px;margin-right:.5em}
.form input:required:user-valid:not(:focus){background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 10'%3E%3Cpath d='M1 5.2 4.4 8.6 11 1.6' fill='none' stroke='%23B49145' stroke-width='2'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .8em center;background-size:.85em}
.form button{position:relative}
.form button::after{content:"";position:absolute;left:14%;right:14%;bottom:7px;height:1.5px;background:rgba(255,255,255,.5);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease-out)}
.form button:hover::after{transform:scaleX(1)}
@media(prefers-reduced-motion:reduce){.fl::before{transition:none}.form button::after{transition:none}}

/* consentimiento SMS: visible siempre (requisito A2P/10DLC) */
.js .sms-consent{display:block;opacity:1;visibility:visible;margin:.2rem 0 .5rem;padding:0;border:0;background:none}
.sms-in{display:flex;flex-direction:column;gap:.7rem;background:var(--alt);border:1px solid var(--line);border-radius:var(--r-s);padding:.9rem 1rem}

/* print: estados finales para el vocabulario v2 y la intro */
@media print{
 .js .ind.rev img,.js .ind.rev .ind-in{clip-path:none!important}
 .js .steps.rev::before,.js .grp-h::after,.js .srv::after,.js .sec-head.rev .folio::after,.js .ctaband::before,.js .sec-head.rev .eyebrow::before{transform:none!important}
 .js .steps.rev .step::after{transform:scale(1)!important}
 .js .steps.rev .step::before{display:block!important}
 .js .pq span{opacity:1!important}
 .js .docman tr.rev{opacity:1!important;animation:none!important}
 .est{display:none}
 .intro  .intro  .intro .hero .eyebrow::before{transform:scaleX(1)!important}
 .intro .hero-strip{transform:none!important}
}

/* la portada v2 gobierna su propia coreografía: se anulan los restos del hero v1 */
.intro .hv2 .hero-img,.intro .hv2 .grain{animation:none}
.hv2 .hero-strip{display:none}

/* identidad verificable: dirección y horario */
.topbar .tb-r{display:flex;align-items:center;gap:.6rem;white-space:nowrap}
.topbar .tb-sep{opacity:.4}
.ft-addr{font-style:normal;font-size:.9rem;line-height:1.6;color:rgba(255,255,255,.78);margin-bottom:.55rem}
.ft-hrs{font-size:.86rem;color:rgba(255,255,255,.62);line-height:1.5}
@media(max-width:560px){.topbar .tb-r{gap:.4rem;font-size:.72rem}}