:root{
  --black:#070707; --black2:#0d0d0d; --black3:#161410;
  --gold:#c79621; --gold2:#e9c454; --gold3:#fff0a1;
  --ivory:#f6f0e4; --paper:#fffdf7; --text:#1e1c18; --muted:#6c675e;
  --line:rgba(202,153,33,.42); --shadow:0 22px 54px rgba(20,14,4,.18);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,Arial,sans-serif;color:var(--text);background:#fff;line-height:1.65}
a{color:inherit;text-decoration:none}
img{max-width:100%}
.container{width:min(1240px,calc(100% - 42px));margin:auto}
.narrow{width:min(900px,100%);margin:auto}
.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:20px;top:20px;z-index:999;background:#fff;padding:10px}
.topbar{background:#020202;color:#aaa;font-size:12px;border-bottom:1px solid #1c1c1c}
.topbar__inner{display:flex;justify-content:space-between;gap:20px;padding:8px 0}.topbar a{color:var(--gold2)}
.header{position:sticky;top:0;z-index:80;background:rgba(4,4,4,.97);border-bottom:1px solid rgba(204,158,39,.35);backdrop-filter:blur(14px)}
.header__inner{height:122px;display:flex;align-items:center;gap:22px}
.brand{display:flex;align-items:center;gap:12px;flex:0 0 auto}
.brand__logo{width:92px;height:92px;object-fit:contain;filter:drop-shadow(0 0 12px rgba(212,175,55,.12))}
.brand__text{display:flex;flex-direction:column;color:#fff;line-height:1.05}
.brand__text strong{font:600 26px "Cormorant Garamond",Georgia,serif}.brand__text small{font-size:9px;letter-spacing:1.5px;color:#aaa;text-transform:uppercase}
.nav{display:flex;align-items:center;gap:24px;color:#eee;font-size:13px;margin-left:22px}.nav>a,.nav__dropdown>a{padding:48px 0}.nav a:hover,.nav a.active{color:var(--gold2)}
.nav__dropdown{position:relative}.nav__menu{position:absolute;top:84px;left:-20px;width:330px;background:#0a0a0a;border:1px solid #463713;padding:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.2s;box-shadow:0 24px 60px rgba(0,0,0,.48);max-height:70vh;overflow:auto}.nav__dropdown:hover .nav__menu,.nav__dropdown:focus-within .nav__menu{opacity:1;visibility:visible;transform:none}.nav__menu a{display:block;padding:10px 12px;border-bottom:1px solid #1f1f1f;color:#ddd}.nav__menu a:last-child{border:0}
.header__phone{margin-left:auto;display:flex;flex-direction:column;text-align:right;line-height:1.05}.header__phone small{font-size:8px;letter-spacing:1.2px;text-transform:uppercase;color:#999}.header__phone a{font-weight:700;color:var(--gold2);font-size:17px}
.menu-toggle{display:none}.btn{display:inline-flex;align-items:center;justify-content:center;min-height:50px;padding:0 23px;border:1px solid transparent;font-size:13px;font-weight:700;transition:.25s}.btn:hover{transform:translateY(-2px)}.btn--gold{background:linear-gradient(135deg,#9d7413,#f2cf62 48%,#a77b16);color:#080808;box-shadow:0 12px 28px rgba(200,155,38,.18)}.btn--outline{border-color:rgba(255,255,255,.42);color:#fff;background:rgba(0,0,0,.18)}.btn--dark{background:#111;color:#fff;border-color:#111}.full{width:100%;margin:5px 0}.center{text-align:center;margin-top:36px}.text-link{color:#8d6811;font-weight:700}
.eyebrow{display:inline-block;color:var(--gold2);font-size:11px;letter-spacing:2.3px;text-transform:uppercase;font-weight:700}.gold-sweep{display:inline;background:linear-gradient(90deg,#b58216 0%,#e7bd4d 34%,#fff7bc 50%,#e9bf50 65%,#b58216 100%);background-size:290% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:sweep 7s linear infinite}@keyframes sweep{0%,40%{background-position:150% 0}72%,100%{background-position:-120% 0}}
.hero{position:relative;overflow:hidden;min-height:790px;background:var(--black);color:#fff;display:flex;align-items:center}.hero__backdrop{position:absolute;inset:0;background-image:linear-gradient(90deg,rgba(0,0,0,.02),rgba(0,0,0,.08) 35%,rgba(0,0,0,.18) 50%,rgba(0,0,0,.55)),var(--hero-bg);background-size:cover;background-position:center;opacity:.72}.hero__flag{position:absolute;left:10%;top:-8%;width:60%;height:116%;background-image:var(--flag);background-size:cover;background-position:50% center;opacity:.82;filter:saturate(1.06) contrast(1.08) brightness(.82);transform:rotate(-2deg) scale(1.04);-webkit-mask-image:linear-gradient(90deg,#000 0,#000 44%,rgba(0,0,0,.88) 61%,rgba(0,0,0,.38) 81%,transparent 100%);mask-image:linear-gradient(90deg,#000 0,#000 44%,rgba(0,0,0,.88) 61%,rgba(0,0,0,.38) 81%,transparent 100%);animation:flagFloat 15s ease-in-out infinite alternate}@keyframes flagFloat{to{transform:rotate(-.8deg) scale(1.075) translate3d(1.5%,-.6%,0)}}.hero__stars{position:absolute;left:0;bottom:0;width:42%;height:45%;background:radial-gradient(circle at 10% 72%,rgba(255,219,86,.34) 0 2px,transparent 3px),radial-gradient(circle at 22% 85%,rgba(255,219,86,.28) 0 1px,transparent 2px),radial-gradient(circle at 32% 65%,rgba(255,219,86,.22) 0 2px,transparent 3px);background-size:90px 90px,130px 130px,160px 160px;opacity:.52}
.hero__grid{position:relative;z-index:3;display:grid;grid-template-columns:1.03fr .97fr;gap:70px;align-items:center;padding:92px 0}.hero__copy h1{font:600 clamp(54px,6.15vw,84px)/.95 "Cormorant Garamond",Georgia,serif;letter-spacing:-1.5px;margin:18px 0 24px}.hero__copy p{font-size:18px;color:#d4d4d4;max-width:720px}.hero__actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.hero__micro{display:flex;gap:20px;flex-wrap:wrap;margin-top:32px;color:#bbb;font-size:11px}.hero__micro span:before{content:"◆";font-size:7px;color:var(--gold2);margin-right:8px}
.hero__portrait{position:relative}.frame{position:relative;border:1px solid rgba(217,174,53,.9);background:#090909;box-shadow:0 24px 64px rgba(0,0,0,.48),0 0 0 5px rgba(195,145,21,.055),inset 0 0 0 1px rgba(255,242,167,.15);overflow:hidden}.frame:before{content:"";position:absolute;inset:8px;border:1px solid rgba(255,230,134,.34);z-index:5;pointer-events:none}.frame:after{content:"";position:absolute;inset:15px;border:1px solid rgba(159,110,10,.26);z-index:5;pointer-events:none}.frame__corner{position:absolute;width:42px;height:42px;z-index:7}.frame__corner:before,.frame__corner:after{content:"";position:absolute;background:linear-gradient(90deg,var(--gold),var(--gold3));box-shadow:0 0 6px rgba(255,218,92,.22)}.frame__corner:before{width:100%;height:1px}.frame__corner:after{width:1px;height:100%}.frame__corner--tl{left:-1px;top:-1px}.frame__corner--tr{right:-1px;top:-1px;transform:rotate(90deg)}.frame__corner--bl{left:-1px;bottom:-1px;transform:rotate(-90deg)}.frame__corner--br{right:-1px;bottom:-1px;transform:rotate(180deg)}
.frame--portrait{height:520px;padding:15px}.frame--portrait img{width:100%;height:100%;object-fit:cover;object-position:50% 38%;display:block}.frame__shade{position:absolute;inset:15px;z-index:2;background:linear-gradient(180deg,transparent 55%,rgba(0,0,0,.05) 68%,rgba(0,0,0,.78) 100%)}.portrait__caption{position:absolute;z-index:4;bottom:32px;left:50%;transform:translateX(-50%);text-align:center;width:78%;text-shadow:0 3px 18px #000}.portrait__caption strong{display:block;font:600 32px/1 "Cormorant Garamond",Georgia,serif}.portrait__caption small{display:block;margin-top:7px;color:var(--gold2);text-transform:uppercase;letter-spacing:1.6px;font-size:9px}
.stats-panel{position:absolute;right:-36px;top:50%;transform:translateY(-50%);width:210px;background:rgba(5,5,5,.94);border:1px solid var(--gold);padding:10px;z-index:8;box-shadow:0 18px 46px rgba(0,0,0,.48)}.stats-panel div{display:grid;grid-template-columns:54px 1fr;gap:9px;align-items:center;padding:14px 8px;border-bottom:1px solid #2d2818}.stats-panel div:last-child{border:0}.stats-panel b{font:700 22px "Cormorant Garamond",serif;color:var(--gold2)}.stats-panel span{font-size:9px;color:#ddd;text-transform:uppercase}
.trust-strip{background:#090909;color:#eee;border-top:1px solid #4d3d17;border-bottom:1px solid #4d3d17}.trust-strip__grid{display:grid;grid-template-columns:repeat(4,1fr)}.trust-strip__grid>div{padding:25px 24px;border-right:1px solid #2f2817;display:flex;gap:12px;align-items:center}.trust-strip__grid>div:last-child{border:0}.trust-strip i{color:var(--gold2);font-style:normal;font-size:27px}.trust-strip span{display:flex;flex-direction:column}.trust-strip strong{font:600 19px "Cormorant Garamond",serif}.trust-strip small{color:#999}
.section{padding:100px 0}.section--dark{background:#080808;color:#fff}.section--black{background:#0a0a0a;color:#fff}.section-heading{max-width:820px;margin-bottom:46px}.section-heading.centered{text-align:center;margin-left:auto;margin-right:auto}.section-heading h2,.media-grid h2,.community h2,.cta h2{font:600 clamp(38px,4.3vw,58px)/1.04 "Cormorant Garamond",Georgia,serif;margin:10px 0 18px}.section-heading p{color:var(--muted)}.section-heading.light p{color:#aaa}.ornament-title{display:flex;justify-content:center;align-items:center;gap:14px;margin-bottom:18px}.ornament-title span{height:1px;width:110px;background:linear-gradient(90deg,transparent,var(--gold))}.ornament-title span:last-child{background:linear-gradient(90deg,var(--gold),transparent)}.ornament-title em{font:600 18px "Cormorant Garamond",serif;color:#a87d16;font-style:normal;text-transform:uppercase;letter-spacing:2px}
.service-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.service-card{position:relative;min-height:245px;padding:30px 24px;background:linear-gradient(145deg,#131313,#080808);border:1px solid rgba(214,171,55,.44);overflow:hidden;transition:.28s}.service-card__shine{position:absolute;inset:-50% auto -50% -70%;width:40%;background:linear-gradient(90deg,transparent,rgba(255,244,184,.17),transparent);transform:skewX(-20deg);transition:.65s}.service-card:hover .service-card__shine{left:140%}.service-card:hover{transform:translateY(-7px);border-color:var(--gold2);box-shadow:0 18px 45px rgba(0,0,0,.4)}.service-card__icon{font-size:40px;color:var(--gold2)}.service-card h3{font:600 25px/1.05 "Cormorant Garamond",serif;margin:18px 0 10px}.service-card p{font-size:12px;color:#aaa}.service-card a{position:absolute;bottom:21px;color:var(--gold2);font-size:12px;font-weight:700}
.process{background:var(--ivory)}.process__grid{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:72px}.process-card{position:relative;background:linear-gradient(145deg,#151515,#080808);border:1px solid rgba(214,171,55,.5);color:#fff;min-height:285px;padding:62px 22px 28px;text-align:center;box-shadow:var(--shadow)}.medal{position:absolute;top:-42px;left:50%;transform:translateX(-50%);width:82px;height:82px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 25%,#fff1a2,#d3a635 27%,#8d650c 57%,#211702 62%,#efca5e 69%,#8b650c 82%,#151000);border:2px solid #f0d064;box-shadow:0 10px 24px rgba(0,0,0,.25),0 0 15px rgba(212,175,55,.28)}.medal:after{content:"";position:absolute;inset:8px;border:1px solid #4e3606;border-radius:50%}.medal span{position:relative;z-index:2;font:700 29px "Cormorant Garamond",serif;color:#201603}.process-card__icon{width:58px;height:58px;margin:0 auto 13px;border:1px solid #8f6a17;border-radius:50%;display:grid;place-items:center;color:var(--gold2);font-size:23px}.process-card h3{font:600 25px "Cormorant Garamond",serif;color:var(--gold2);margin:7px}.process-card p{font-size:12px;color:#bbb}
.media-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:68px;align-items:center}.media-grid p{color:#bbb}.lead{font-size:18px}.frame--about{height:470px;margin-top:28px}.frame--about img{width:100%;height:100%;object-fit:cover;object-position:50% 36%}.video-label{display:inline-block;border:1px solid #4d3d17;color:var(--gold2);padding:8px 11px;text-transform:uppercase;letter-spacing:1.6px;font-size:9px;margin-bottom:10px}.frame--video{aspect-ratio:16/9;padding:14px}.frame--video video,.frame--video>img{width:100%;height:100%;object-fit:cover;display:block}.video-cover{position:absolute;inset:14px;z-index:3;background:linear-gradient(90deg,rgba(0,0,0,.77),rgba(0,0,0,.38));display:flex;align-items:center;justify-content:center;gap:18px;transition:.25s}.video-cover.hidden{opacity:0;pointer-events:none}.video-cover--static{pointer-events:none}.video-cover small{display:block;color:var(--gold2);text-transform:uppercase;letter-spacing:1.4px}.video-cover strong{font:600 28px "Cormorant Garamond",serif}.play-button{width:72px;height:72px;border:1px solid var(--gold2);border-radius:50%;background:rgba(0,0,0,.5);color:var(--gold3);font-size:24px;cursor:pointer}.media-note{font-size:11px;color:#888}.media-note code{color:#d7bd66}
.offices{background:var(--paper)}.offices__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:30px}.office-card{display:grid;grid-template-columns:1.38fr .78fr;border:1px solid rgba(162,111,14,.36);padding:14px;background:linear-gradient(145deg,#fffdf7,#f1e8d5);box-shadow:var(--shadow)}.frame--office{height:360px}.frame--office img{width:100%;height:100%;object-fit:cover;display:block}.office-card__copy{padding:28px 23px;display:flex;flex-direction:column;justify-content:center;border-left:1px solid rgba(180,130,24,.25)}.office-card__copy h3{font:600 31px/1.04 "Cormorant Garamond",serif;margin:9px 0 12px}.office-card__copy p{color:#615b51}
.payments{background:#f3ecde}.payment-panel{max-width:960px;margin:auto;background:#090909;border:1px solid var(--gold);display:grid;grid-template-columns:repeat(4,1fr);padding:12px;box-shadow:var(--shadow)}.payment-panel span{padding:23px;text-align:center;color:#e9d28a;border:1px solid #2f2817;font-weight:700}
.community__grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.community p{color:#aaa}.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{border:1px solid #3d3218;color:#d4b95e;padding:8px 10px;font-size:10px}
.route-panel{
  position:relative;
  min-height:330px;
  border:1px solid #4a3912;
  overflow:hidden;

  background-image:
    linear-gradient(
      rgba(0,0,0,.42),
      rgba(0,0,0,.64)
    ),
    url('/assets/img/conexion-el-salvador.webp') !important;

  background-size:cover !important;
  background-position:center !important;
  background-repeat:no-repeat !important;

  display:flex;
  align-items:center;
  justify-content:center;
  gap:20px;
}

.route-panel span,
.route-panel i{
  position:relative;
  z-index:2;
}.route-panel span{border:1px solid var(--gold);padding:15px;background:#080808;color:var(--gold2);font-size:11px;font-weight:700}.route-panel i{width:110px;height:1px;background:linear-gradient(90deg,var(--gold),#fff1a0,var(--gold));box-shadow:0 0 14px #ddb33c}
.faq-preview details,.faq-block details{border-bottom:1px solid #ddd;padding:18px 0}.faq-preview summary,.faq-block summary{font-weight:700;cursor:pointer}.faq-preview p,.faq-block p{color:#68635c}.cta{background:#070707;color:#fff;border-top:1px solid #493813;padding:72px 0}.cta__inner{display:flex;justify-content:space-between;align-items:center;gap:30px}.cta__actions{display:flex;gap:10px;flex-wrap:wrap}
.footer{position:relative;background:#050505;color:#aaa;padding:76px 0 25px}.footer__line{position:absolute;top:0;left:12%;right:12%;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent);box-shadow:0 0 14px rgba(212,175,55,.3)}.footer__grid{display:grid;grid-template-columns:1.2fr .8fr 1fr 1fr;gap:36px}.footer__brand img{width:100px;height:100px;object-fit:contain}.footer h3{font:600 21px "Cormorant Garamond",serif;color:#fff}.footer__grid>div>a:not(.footer__brand){display:block;margin:7px 0}.footer p{font-size:11px}.footer__badges span{display:inline-block;border:1px solid #352a13;color:#c9ae61;padding:7px;margin:4px 4px 0 0;font-size:9px}.footer__bottom{border-top:1px solid #1c1c1c;margin-top:42px;padding-top:18px;display:flex;justify-content:space-between;font-size:9px}.float{position:fixed;top:48%;z-index:90;background:#090909;border:1px solid var(--gold);color:var(--gold2);writing-mode:vertical-rl;text-transform:uppercase;letter-spacing:1.4px;font-size:9px;padding:15px 9px}.float--wa{left:0}.float--call{right:0}
.page-hero{position:relative;overflow:hidden;background:radial-gradient(circle at 80% 15%,#292313,#080808 58%);color:#fff;padding:115px 0 90px;text-align:center}.page-hero__pattern{position:absolute;inset:0;background-image:url('/assets/img/hero-backdrop.svg');background-size:cover;background-position:center;opacity:.20}.page-hero .container{position:relative;z-index:2}.page-hero h1{font:600 clamp(52px,6vw,78px)/.97 "Cormorant Garamond",serif;margin:16px 0 22px}.page-hero p{color:#c8c8c8;font-size:18px}.service-list{display:grid;gap:12px}.service-row{display:grid;grid-template-columns:70px 1fr auto;gap:25px;align-items:center;background:#fff;border:1px solid #ddd3bb;padding:28px;box-shadow:0 10px 24px rgba(0,0,0,.04)}.service-row__number{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font:700 20px "Cormorant Garamond",serif;color:#221703;background:radial-gradient(circle at 35% 25%,#fff1a2,#d3a635 28%,#8b650d 60%,#e9c65e 72%,#6f500b);border:1px solid #f0d064}.service-row h2{font:600 31px "Cormorant Garamond",serif;margin:0}.service-row p{margin:5px 0;color:#68635c}.annex{margin-top:48px;background:#090909;color:#fff;border:1px solid #4d3a12;padding:48px}.annex h2{font:600 40px "Cormorant Garamond",serif}.annex p{color:#bbb}
.service-detail__grid{display:grid;grid-template-columns:1fr 330px;gap:70px}.content-section{padding-bottom:54px}.content-section h2{font:600 38px "Cormorant Garamond",serif;margin:8px 0 15px}.check-list{list-style:none;padding:0}.check-list li{position:relative;padding:9px 0 9px 27px}.check-list li:before{content:"✓";position:absolute;left:0;color:#9c7415;font-weight:900}.notice{background:#faf5e9;border-left:3px solid var(--gold);padding:16px;font-size:13px}.timeline>div{display:grid;grid-template-columns:42px 1fr;gap:14px;margin:14px 0}.timeline b{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:#111;color:var(--gold2)}.service-video{max-width:820px}.service-aside{position:relative}.aside-card{position:sticky;top:150px;background:#090909;color:#fff;border:1px solid #4c3a12;padding:32px}.aside-card__logo{width:74px;height:74px;object-fit:contain;margin-bottom:12px}.aside-card h3{font:600 29px "Cormorant Garamond",serif}.aside-card p,.aside-card small{color:#bbb}.aside-card hr{border:0;border-top:1px solid #2b2b2b;margin:18px 0}.eeat-box{border:1px solid #ded4bc;background:#faf7ef;padding:28px}.eeat-box h3{font:600 28px "Cormorant Garamond",serif}
.confidence-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.confidence-grid article{background:#fff;border:1px solid #ddd3bb;padding:32px 26px}.confidence-grid b{font:700 35px "Cormorant Garamond",serif;color:#a47c18}.confidence-grid h3{font:600 24px "Cormorant Garamond",serif}.contact-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.contact-card{border:1px solid #ddd3bb;background:#fffdf8;padding:34px}.contact-card h2{font:600 31px "Cormorant Garamond",serif}.contact-card .btn{width:100%;margin:5px 0}.contact-card hr{border:0;border-top:1px solid #ddd3bb}.resource-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}.resource-grid article{border:1px solid #ddd3bb;background:#fffdf8;padding:34px}.resource-grid article>span{color:#9b7417;text-transform:uppercase;letter-spacing:1.5px;font-size:9px}.resource-grid h2{font:600 31px "Cormorant Garamond",serif}.resource-grid p{color:#68635c}.resource-grid a{color:#8d6811;font-weight:700}
.reveal{opacity:0;transform:translateY(16px);transition:.6s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:1120px){.brand__text{display:none}.nav{gap:17px;margin-left:10px}.header__phone{display:none}.service-grid{grid-template-columns:repeat(3,1fr)}.stats-panel{right:0}.footer__grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.header__inner{height:96px}.brand__logo{width:72px;height:72px}.nav,.header__cta{display:none}.menu-toggle{display:block;margin-left:auto;background:transparent;border:1px solid #484848;color:#fff;padding:8px 12px;font-size:20px}.header.open .nav{display:flex;position:absolute;top:96px;left:0;right:0;background:#080808;padding:18px;flex-direction:column;align-items:stretch;margin:0}.header.open .nav>a,.header.open .nav__dropdown>a{padding:10px 0}.nav__menu{position:static;width:100%;opacity:1;visibility:visible;transform:none;display:none}.nav__dropdown:hover .nav__menu,.nav__dropdown:focus-within .nav__menu{display:block}.hero__grid,.media-grid,.community__grid,.service-detail__grid{grid-template-columns:1fr}.hero__portrait{max-width:620px;margin:auto;width:100%}.service-grid{grid-template-columns:repeat(2,1fr)}.process__grid{grid-template-columns:repeat(2,1fr);gap:58px 16px}.offices__grid{grid-template-columns:1fr}.office-card{grid-template-columns:1.25fr .75fr}.payment-panel{grid-template-columns:repeat(2,1fr)}.contact-grid{grid-template-columns:1fr}.resource-grid{grid-template-columns:1fr}.aside-card{position:static}.cta__inner{align-items:flex-start;flex-direction:column}.stats-panel{right:10px}.hero__flag{width:72%;left:-20%}}
@media(max-width:620px){.container{width:min(100% - 26px,1240px)}.topbar__inner{flex-direction:column;gap:4px}.header__inner{height:86px}.brand__logo{width:62px;height:62px}.header.open .nav{top:86px}.hero{min-height:auto}.hero__grid{padding:62px 0}.hero__copy h1,.page-hero h1{font-size:48px}.hero__portrait{display:none}.hero__flag{left:-45%;width:142%;opacity:.42}.service-grid,.process__grid,.trust-strip__grid,.confidence-grid,.footer__grid,.payment-panel{grid-template-columns:1fr}.process__grid{gap:58px}.office-card{grid-template-columns:1fr}.office-card__copy{border-left:0;border-top:1px solid rgba(180,130,24,.25)}.service-row{grid-template-columns:58px 1fr}.service-row .btn{grid-column:2}.footer__bottom{flex-direction:column;gap:10px}.float{display:none}.ornament-title span{width:48px}}
@media(prefers-reduced-motion:reduce){.gold-sweep,.hero__flag{animation:none}.reveal{opacity:1;transform:none}}


/* =========================================================
   V3.1 — BANDERA PREMIUM TIPO CINTA / OVERLAY
   ========================================================= */
.hero__flag{
  left:-15% !important;
  top:-15% !important;
  width:52% !important;
  height:130% !important;
  background-size:cover !important;
  background-position:36% 54% !important;
  opacity:.49 !important;
  filter:saturate(.86) contrast(1.06) brightness(.62) !important;
  transform:rotate(-1deg) scale(1.05) !important;
  -webkit-mask-image:
    linear-gradient(90deg,
      #000 0%,
      rgba(0,0,0,.96) 33%,
      rgba(0,0,0,.76) 55%,
      rgba(0,0,0,.32) 76%,
      transparent 100%) !important;
  mask-image:
    linear-gradient(90deg,
      #000 0%,
      rgba(0,0,0,.96) 33%,
      rgba(0,0,0,.76) 55%,
      rgba(0,0,0,.32) 76%,
      transparent 100%) !important;
  animation:flagLuxury 16s ease-in-out infinite alternate !important;
}

.hero__flag::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(180deg,
      rgba(5,5,5,.12),
      rgba(5,5,5,.04) 42%,
      rgba(5,5,5,.32)),
    linear-gradient(90deg,
      transparent 0%,
      rgba(5,5,5,.06) 52%,
      rgba(7,7,7,.96) 100%);
}

.hero__backdrop{
  opacity:.90 !important;
  background-image:
    linear-gradient(90deg,
      rgba(0,0,0,.03) 0%,
      rgba(0,0,0,.26) 28%,
      rgba(0,0,0,.67) 52%,
      rgba(0,0,0,.91) 78%,
      rgba(0,0,0,.96) 100%),
    var(--hero-bg) !important;
}

@keyframes flagLuxury{
  from{transform:rotate(-1.7deg) scale(1.05) translate3d(0,0,0)}
  to{transform:rotate(-.4deg) scale(1.08) translate3d(1.4%,-.4%,0)}
}

/* =========================================================
   V3.1 — MARCOS PREMIUM ORNAMENTALES
   ========================================================= */
.frame{
  border:1px solid rgba(226,185,69,.92) !important;
  box-shadow:
    0 26px 64px rgba(0,0,0,.42),
    0 0 0 5px rgba(181,126,12,.055),
    0 0 0 9px rgba(0,0,0,.55),
    inset 0 0 0 1px rgba(255,245,184,.14),
    inset 0 0 36px rgba(0,0,0,.18) !important;
}

.frame::before{
  inset:8px !important;
  border:1px solid rgba(255,225,116,.48) !important;
  box-shadow:
    inset 0 0 0 4px rgba(10,10,10,.42),
    0 0 13px rgba(215,174,53,.08) !important;
}

.frame::after{
  inset:16px !important;
  border:1px solid rgba(166,113,10,.40) !important;
  box-shadow:inset 0 0 22px rgba(213,171,55,.06) !important;
}

.frame__corner{
  width:58px !important;
  height:58px !important;
  z-index:9 !important;
}

.frame__corner::before,
.frame__corner::after{
  box-shadow:
    0 0 5px rgba(255,225,116,.32),
    0 0 12px rgba(198,151,31,.15) !important;
}

.frame__corner::before{
  height:2px !important;
}

.frame__corner::after{
  width:2px !important;
}

/* ornamental inner hooks */
.frame__corner--tl::after,
.frame__corner--tr::after,
.frame__corner--bl::after,
.frame__corner--br::after{
  border-radius:2px;
}

.frame--portrait,
.frame--about,
.frame--office,
.frame--video{
  background:
    linear-gradient(145deg,#0b0b0b,#050505) !important;
}

/* image inset so it reads as a physical frame */
.frame--portrait img,
.frame--about img,
.frame--office img,
.frame--video video,
.frame--video > img{
  position:relative;
  z-index:1;
  border:1px solid rgba(255,231,139,.15);
  box-shadow:
    inset 0 0 35px rgba(0,0,0,.30),
    0 0 0 1px rgba(0,0,0,.65);
}

/* portrait specifically */
.frame--portrait{
  padding:18px !important;
}

.frame--portrait img{
  border-radius:1px;
}

/* about photo */
.frame--about{
  padding:18px !important;
}

/* office cards */
.office-card{
  box-shadow:
    0 24px 54px rgba(56,41,10,.16),
    0 0 0 4px rgba(175,123,14,.035),
    inset 0 0 0 1px rgba(255,255,255,.62) !important;
}

.frame--office{
  padding:16px !important;
}

.office-card__copy{
  position:relative;
}

.office-card__copy::before{
  content:"";
  position:absolute;
  left:10px;
  top:18px;
  bottom:18px;
  width:1px;
  background:linear-gradient(180deg,transparent,var(--gold),transparent);
  opacity:.45;
}

/* video */
.frame--video{
  padding:18px !important;
}

/* subtle metallic sweep on frame */
.frame .frame__corner--tl{
  filter:drop-shadow(0 0 5px rgba(222,181,57,.22));
}

@media(max-width:900px){
  .hero__flag{
    left:-22% !important;
    width:82% !important;
    opacity:.38 !important;
  }
}

@media(max-width:620px){
  .hero__flag{
    left:-50% !important;
    width:145% !important;
    opacity:.30 !important;
    background-position:25% center !important;
  }
}


/* =========================================================
   V3.2 — HERO ADMINISTRABLE
   Cambie únicamente /assets/img/hero-principal.*
   El overlay premium y la bandera permanecen intactos.
   ========================================================= */

.hero__photo{
  position:absolute;
  inset:0;
  z-index:0;
  background-image:var(--hero-photo);
  background-size:cover;
  background-position:center 42%;
  background-repeat:no-repeat;
  filter:
    saturate(.86)
    contrast(1.06)
    brightness(.72);
  transform:scale(1.015);
}

/* capa oscura independiente: nunca se pierde al cambiar la foto */
.hero__photo::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg,
      rgba(3,3,3,.18) 0%,
      rgba(3,3,3,.28) 30%,
      rgba(3,3,3,.57) 60%,
      rgba(3,3,3,.86) 74%,
      rgba(3,3,3,.96) 100%),
    linear-gradient(150deg,
      rgba(0,0,0,.11),
      transparent 35%,
      rgba(0,0,0,.36) 100%);
}

/* pequeño halo dorado editorial */
.hero__photo::before{
  content:"";
  position:absolute;
  z-index:1;
  left:7%;
  bottom:5%;
  width:38%;
  height:42%;
  border-radius:50%;
  background:
    radial-gradient(circle,
      rgba(216,173,50,.13),
      rgba(216,173,50,.035) 45%,
      transparent 72%);
  filter:blur(24px);
}

/* el backdrop ahora funciona solo como textura premium */
.hero__backdrop{
  z-index:1 !important;
  opacity:.28 !important;
  background-image:var(--hero-bg) !important;
  background-size:cover !important;
  background-position:center !important;
  mix-blend-mode:screen;
  pointer-events:none;
}

/* bandera siempre queda encima de la foto pero debajo del contenido */
.hero__flag{
  z-index:2 !important;
}

/* contenido sobre todas las capas */
.hero__grid{
  z-index:4 !important;
}

/* grid/stars decorativos */
.hero__stars{
  z-index:3 !important;
}

/* Control fácil del encuadre.
   Si posteriormente quiere mover la foto:
   center 35% = más arriba
   center 50% = más abajo
*/
@media(max-width:900px){
  .hero__photo{
    background-position:center 38%;
  }
}

@media(max-width:620px){
  .hero__photo{
    background-position:58% center;
    filter:
      saturate(.82)
      contrast(1.04)
      brightness(.62);
  }
}


/* =========================================================
   V4 FINAL — ACABADO BOUTIQUE LEGAL PREMIUM
   ========================================================= */

/* Marco decorativo del header inspirado en firma boutique */
.header::before{
  content:"";
  position:absolute;
  inset:7px 10px;
  border:1px solid rgba(201,150,32,.25);
  pointer-events:none;
}
.header::after{
  content:"◆";
  position:absolute;
  left:14px;
  top:8px;
  color:var(--gold);
  font-size:12px;
  opacity:.75;
  text-shadow:
    calc(100vw - 38px) 0 0 var(--gold),
    0 104px 0 var(--gold),
    calc(100vw - 38px) 104px 0 var(--gold);
  pointer-events:none;
}

/* Hero: separación editorial más similar a la referencia */
.hero__copy{
  padding-left:8px;
}
.hero__copy h1{
  max-width:760px;
}
.hero__portrait{
  padding:10px 0;
}
.stats-panel{
  background:rgba(4,4,4,.965);
  box-shadow:
    0 18px 50px rgba(0,0,0,.55),
    inset 0 0 0 1px rgba(255,231,135,.055);
}

/* Mayor sensación física de marco */
.frame{
  outline:1px solid rgba(121,83,7,.65);
  outline-offset:6px;
}
.frame::before{
  outline:1px solid rgba(76,52,6,.52);
  outline-offset:5px;
}

/* Ornamentación extra en esquinas sin assets externos */
.frame__corner::before{
  background:
    linear-gradient(90deg,var(--gold),var(--gold3) 45%,var(--gold)) !important;
}
.frame__corner::after{
  background:
    linear-gradient(180deg,var(--gold),var(--gold3) 45%,var(--gold)) !important;
}

/* placas de oficinas con look editorial */
.office-card{
  position:relative;
  overflow:hidden;
}
.office-card::before{
  content:"";
  position:absolute;
  inset:7px;
  border:1px solid rgba(196,146,26,.25);
  pointer-events:none;
  z-index:4;
}
.office-card::after{
  content:"⚖";
  position:absolute;
  right:26px;
  bottom:16px;
  color:rgba(156,112,19,.09);
  font-size:80px;
  line-height:1;
  pointer-events:none;
}

/* métodos de pago más premium */
.payment-panel{
  position:relative;
  outline:1px solid rgba(145,100,13,.6);
  outline-offset:6px;
}
.payment-panel::before{
  content:"";
  position:absolute;
  inset:6px;
  border:1px solid rgba(241,203,91,.22);
  pointer-events:none;
}
.payment-panel span{
  position:relative;
  transition:.25s;
}
.payment-panel span:hover{
  color:#fff0a0;
  background:#12100a;
}

/* tarjetas proceso con conectores visuales */
.process__grid{
  position:relative;
}
.process__grid::before{
  content:"";
  position:absolute;
  left:7%;
  right:7%;
  top:0;
  height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),#fff0a0,var(--gold),transparent);
  box-shadow:0 0 10px rgba(217,176,56,.25);
}

/* biblioteca de videos */
.video-library{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:36px 24px;
}
.video-library__card{
  background:#fffdf8;
  border:1px solid #ddd2b9;
  padding:16px 16px 26px;
  box-shadow:0 18px 40px rgba(38,27,6,.08);
}
.video-library__card h2{
  font:600 31px/1.06 "Cormorant Garamond",serif;
  margin:22px 8px 8px;
}
.video-library__card p{
  margin:0 8px;
  color:#69635a;
}

/* Resource cards premium */
.resource-grid article,
.contact-card,
.eeat-box{
  box-shadow:0 14px 32px rgba(37,27,6,.055);
}

/* Mobile fix for header corner ornament */
@media(max-width:900px){
  .header::after{display:none}
  .video-library{grid-template-columns:1fr}
}
/* =========================================================
   FONDO IMAGEN — ROUTE PANEL
   ========================================================= */

.route-panel{
    position:relative !important;
    overflow:hidden !important;

    background:
        linear-gradient(
            rgba(0,0,0,.42),
            rgba(0,0,0,.64)
        ),
        url('/assets/img/conexion-el-salvador.webp')
        center center / cover no-repeat !important;
}

/* mantener las tarjetas y la línea encima de la foto */
.route-panel span,
.route-panel i{
    position:relative;
    z-index:5;
}