/* Paquetes Vantus · Ing. Víctor Marín · 08/10/2026. */
:root{--navy:#001b41;--ink:#edf3fb;--gold:#ffb300;--gold-light:#ffcf69;--muted:#b2c7df;--serif:'Playfair Display',Georgia,serif;--sans:Inter,system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;scroll-padding-top:100px}
body{font-family:var(--sans);background:var(--navy);color:var(--ink);font-size:16px;line-height:1.6}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit}
button,a,label,summary{touch-action:manipulation}
button,summary{cursor:pointer}
img{display:block;max-width:100%;object-fit:cover}
button{color:inherit}
h1,h2,h3{font-family:var(--serif);font-weight:400;line-height:1.2;letter-spacing:-.025em}
h2{font-size:clamp(35px,3vw,55px)}
em{font-weight:400;color:var(--gold-light)}
[hidden]{display:none!important}
.wrap{width:calc(100% - 112px);max-width:1600px;margin-inline:auto}
.v-icon{display:block;width:25px;height:25px;flex-shrink:0}
.eyebrow{display:flex;align-items:center;gap:15px;color:var(--gold-light);font-size:12px;letter-spacing:.18em;line-height:1.6;margin-bottom:24px}
.eyebrow:before{content:'';width:32px;height:1px;background:var(--gold);flex-shrink:0}
.button{display:inline-flex;align-items:center;justify-content:center;gap:18px;min-height:56px;padding:17px 26px;border:1px solid transparent;font-size:14px;font-weight:600;letter-spacing:.055em;transition:background .2s,box-shadow .2s}
.button.gold{background:var(--gold);color:#001b41;border-color:var(--gold)}
.button.gold:hover{background:#ffcd5a;box-shadow:0 8px 30px #ffb30018}
.button.outline{color:#dce9f8;border-color:#ffffff35;background:#ffffff03}
.button.outline:hover{background:#ffffff09}
.button .v-icon{width:21px;height:21px}
:is(a,button,input,select,textarea,summary):focus-visible{outline:2px solid var(--gold-light);outline-offset:4px}
.skip-link{position:fixed;left:20px;top:-100px;z-index:100;background:var(--gold);color:#001b41;padding:15px}
.skip-link:focus{top:20px}
.package-header{display:flex;align-items:center;justify-content:space-between;gap:25px;height:88px;padding-inline:4%;border-bottom:1px solid #ffffff20;background:#001b41f2;position:sticky;top:0;z-index:40;backdrop-filter:blur(16px)}
.brand{display:flex;align-items:center;gap:13px;color:#f4f7fc;white-space:nowrap}
.brand>img{width:33px;height:33px;object-fit:contain}
.brand>span{font-family:var(--serif);font-size:28px;display:flex;align-items:baseline;gap:12px}
.brand small{font-family:var(--sans);font-weight:600;font-size:10px;letter-spacing:.15em;color:var(--gold)}
.package-header nav{display:flex;align-items:center;gap:30px;font-size:13px;letter-spacing:.04em}
.package-header nav>a:hover{color:var(--gold-light)}
.package-header .nav-client{border:1px solid #ffb30080;color:var(--gold-light);padding:13px 20px}
.package-hero{position:relative;isolation:isolate;min-height:620px;display:flex;align-items:center;padding:84px 0 90px;background:#00152f}
.package-hero-image{position:absolute;inset:0;width:100%;height:100%;z-index:-2;object-position:center 58%}
.package-hero:after{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,#00152fed,#001b419e 57%,#001b4145),linear-gradient(0deg,#001b41d9,transparent 65%)}
.hero-layout{display:flex;justify-content:space-between;align-items:center;gap:60px}
.hero-editorial{max-width:900px}
.package-hero h1{font-size:clamp(48px,5vw,86px);line-height:1.12}
.hero-editorial>p:not(.eyebrow){font-size:19px;line-height:1.9;color:#d5e2f0;margin:27px 0 32px;max-width:680px}
.hero-benefits{display:flex;align-items:center;flex-wrap:wrap;gap:25px;margin-top:30px;font-size:13px;color:#c7d8eb}
.hero-benefits>span{display:flex;align-items:center;gap:10px}
.hero-benefits i{color:var(--gold-light)}
.hero-benefits .v-icon{width:21px;height:21px}
.hero-window{flex-shrink:0;width:335px;position:relative;padding:34px;background:linear-gradient(145deg,#17395ae8,#001b41eb);border:1px solid #e9c17455;box-shadow:0 24px 60px #0003}
.hero-window-icon{display:grid;place-items:center;width:52px;height:52px;color:var(--gold-light);border:1px solid #ffb30050;margin-bottom:24px;background:#ffb30008}
.hero-window>small{font-size:11px;letter-spacing:.15em;color:var(--gold-light)}
.hero-window h2{font-size:34px;margin:18px 0}
.hero-window>p{font-size:15px;line-height:1.8;color:#c6d5e8}
.hero-window>div{display:flex;flex-direction:column;gap:10px;padding-top:20px;margin-top:25px;border-top:1px solid #e9c17450;font-size:13px;color:#dbcfb0}
.hero-reference{position:absolute;bottom:22px;right:4%;font-size:10px;letter-spacing:.12em;color:#aabfd8}
.package-studio{position:relative;isolation:isolate;padding:70px 0 48px;background:linear-gradient(135deg,#032b54,#001b41 70%)}
.package-studio:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:url('espirales-vantus.svg') center top/cover no-repeat,radial-gradient(ellipse at 98% 22%,#ffb30014,transparent 55%);opacity:.9}
.studio-intro{display:flex;justify-content:space-between;align-items:center;gap:50px;margin-bottom:35px}
.studio-intro>p{max-width:420px;font-size:17px;color:#bbcee4;line-height:1.8;padding-left:25px;border-left:1px solid #e9c17460}
.package-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:28px}
.package-steps button{display:flex;align-items:center;gap:14px;padding:20px;border:1px solid #ffffff20;background:#001b4180;text-align:left;min-height:78px;transition:background .2s,border-color .2s}
.package-steps button>span{font-size:12px;color:#819ebc}
.package-steps button>i{color:#c7af80}
.package-steps button>strong{font-size:16px;font-weight:500}
.package-steps button[aria-current=step]{border-color:#ffb30090;background:linear-gradient(120deg,#ffb30018,#ffb30005);color:var(--gold-light)}
.package-steps button[aria-current=step]>span,
.package-steps button[aria-current=step]>i{color:var(--gold-light)}
.package-steps button.is-complete{border-bottom-color:#e9c17465}
.studio-body{padding:35px;background:linear-gradient(145deg,#001b41e8,#001b41c9);border:1px solid #e9c17435;box-shadow:0 25px 65px #0002}
.package-pane{scroll-margin-top:110px}
.section-heading{display:flex;justify-content:space-between;align-items:center;gap:40px;margin-bottom:30px}
.section-heading h2{font-size:clamp(32px,2.8vw,45px)}
.section-heading .eyebrow{font-size:11px;margin-bottom:16px}
.section-heading>p{font-size:16px;color:#b7cce3;max-width:400px;line-height:1.8}
.project-types{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}
.project-tile{padding:0;background:linear-gradient(140deg,#ffffff08,#ffffff02);border:1px solid #ffffff25;text-align:left;overflow:hidden;transition:border-color .25s,background .25s}
.project-tile:hover{border-color:#ffb30090}
.project-tile.active{border-color:var(--gold);box-shadow:0 0 0 1px var(--gold);background:linear-gradient(140deg,#ffb30014,#ffffff02)}
.tile-image{height:160px;position:relative;overflow:hidden}
.tile-image>img{width:100%;height:100%;transition:transform .6s}
.project-tile:hover .tile-image>img{transform:scale(1.04)}
.tile-selected{display:none;position:absolute;right:13px;top:13px;align-items:center;justify-content:center;width:32px;height:32px;background:var(--gold);color:#001b41;box-shadow:0 5px 15px #0003}
.project-tile.active .tile-selected{display:flex}
.tile-selected .v-icon{width:20px;height:20px}
.tile-copy{display:flex;align-items:center;gap:13px;padding:20px 16px;min-height:110px}
.tile-icon{color:#edc171;display:grid;place-items:center;width:36px;height:36px;flex-shrink:0;border:1px solid #e9c17440;background:#ffb30005}
.tile-icon .v-icon{width:23px;height:23px}
.tile-copy small{font-size:11px;color:#b1c6df;line-height:1.6;display:block}
.tile-copy h3{font-family:var(--sans);font-size:17px;font-weight:500;line-height:1.5;letter-spacing:0;margin-top:6px}
.tile-copy>i{margin-left:auto;color:#e9c174}
.tile-copy>i .v-icon{width:16px;height:16px}
.reference-note{font-size:13px;color:#9fb9d6;margin-top:22px;line-height:1.8}
.config-layout{display:grid;grid-template-columns:1.25fr .8fr;gap:28px;align-items:start}
.config-form{padding:32px;border:1px solid #ffffff25;border-top:2px solid #ffb30080;background:#ffffff03}
.config-form>.eyebrow{font-size:11px;margin-bottom:20px}
.config-form h3{font-size:34px;margin-bottom:18px}
.config-form>p:not(.eyebrow):not(.parameter-note){font-size:16px;color:#b7cce3;margin-bottom:28px}
label{display:block;font-size:15px;font-weight:500;color:#d5e4f5}
input:not([type=checkbox]),select,textarea{display:block;width:100%;padding:14px 15px;margin-top:9px;border:1px solid #ffffff30;min-height:53px;background:#001631;color:#eaf2fb;border-radius:0;font-size:16px;font-weight:400}
input::placeholder,textarea::placeholder{color:#83a0c0}
select option{background:#001b41;color:white}
textarea{resize:vertical}
.config-common,#project-fields{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.config-form>label{margin-top:24px}
#project-fields{margin-top:23px}
.parameter-note{display:flex;gap:12px;margin-top:25px;font-size:13px;line-height:1.8;color:#a9c0dc;font-weight:400}
.parameter-note>span{color:#e3ba6d}
.parameter-note .v-icon{width:21px;height:21px}
.project-route{border:1px solid #e9c17435;background:linear-gradient(140deg,#ffffff07,#ffb30004)}
.route-cover{height:260px;position:relative}
.route-cover>img{width:100%;height:100%}
.route-cover>small{position:absolute;bottom:15px;left:20px;padding:6px 10px;background:#001b41d9;font-size:10px;letter-spacing:.1em;color:#d9e8f7}
.route-content{padding:28px}
.route-content>.eyebrow{font-size:11px;margin-bottom:19px}
.route-content>h3{font-size:32px;margin-bottom:16px}
.route-content>p{font-size:15px;line-height:1.8;color:#b6cbe2}
.project-route ol{list-style:none;counter-reset:route;margin-top:24px}
.project-route li{display:flex;gap:15px;counter-increment:route;padding:16px 0;border-top:1px solid #ffffff20;font-size:15px;line-height:1.7;color:#c5d8ee}
.project-route li:before{content:'0' counter(route);color:#e7bd6b;font-size:12px;padding-top:2px}
.route-foot{display:flex;align-items:flex-start;gap:13px;padding-top:22px;border-top:1px solid #e9c17435;margin-top:6px}
.route-foot>span{color:var(--gold-light)}
.route-foot>p{font-size:13px;color:#acbfd8;line-height:1.8}
.level-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.level-card{display:flex;flex-direction:column;padding:30px;border:1px solid #ffffff30;background:linear-gradient(135deg,#ffffff07,#ffffff02);text-align:left;transition:border-color .2s,background .2s}
.level-card:hover{border-color:#ffb30090}
.level-card.active{border-color:var(--gold);background:linear-gradient(135deg,#20476799,#ffb30009);box-shadow:inset 0 3px 0 var(--gold),0 18px 40px #0002}
.level-top{display:flex;align-items:center;gap:14px;margin-bottom:27px}
.level-symbol{display:grid;place-items:center;width:48px;height:48px;border:1px solid #e9c17455;background:#ffb30008;color:#e9c174;flex-shrink:0}
.level-symbol .v-icon{width:28px;height:28px}
.level-top>small{font-size:11px;letter-spacing:.15em;color:#e2bd76}
.level-order{margin-left:auto;color:#89a8ca;font-family:var(--serif);font-size:24px}
.level-card h3{font-size:33px;line-height:1.2;margin-bottom:20px}
.level-card>p{font-size:16px;line-height:1.8;color:#b7cce3}
.level-card ul{list-style:none;padding:23px 0;margin:23px 0;border-block:1px solid #ffffff25;flex:1}
.level-card li{display:flex;gap:11px;padding:8px 0;font-size:15px;line-height:1.7;color:#d0dff1}
.level-card li .v-icon{color:#e6bc70;width:19px;height:19px;margin-top:3px}
.level-price>span{display:block;font-size:17px;color:#e7c17d}
.level-price>small{display:block;font-size:13px;color:#9fb9d5;margin-top:6px}
.level-select{display:flex;align-items:center;justify-content:center;gap:12px;padding:15px;margin-top:25px;border:1px solid #ffffff30;background:#ffffff05;font-size:14px;font-weight:500}
.level-select .v-icon{width:19px;height:19px}
.level-card.active .level-select{background:var(--gold);border-color:var(--gold);color:#001b41}
.quest-option{display:flex;align-items:center;gap:18px;border:1px solid #e9c17455;background:linear-gradient(100deg,#ffb3000c,#ffffff03);padding:25px;margin-top:30px;cursor:pointer}
.quest-option>input{width:21px;height:21px;accent-color:var(--gold);flex-shrink:0}
.quest-option-icon{color:#ecc578}
.quest-option-icon .v-icon{width:42px;height:42px}
.quest-option strong{display:block;font-size:20px;font-weight:500;color:#eef4fb}
.quest-option small{display:block;font-size:15px;font-weight:400;color:#b2c9e2;margin-top:8px;line-height:1.8}
.quest-option>b{margin-left:auto;font-size:11px;font-weight:500;letter-spacing:.12em;color:#e9c174}
.quest-option:has(input:checked){border-color:var(--gold);background:linear-gradient(100deg,#ffb30018,#ffffff03)}
.quote-details{margin-top:25px;border-top:1px solid #ffffff20}
.quote-details>summary{display:flex;align-items:center;gap:13px;padding:21px 0;list-style:none;font-size:16px;color:#c8d9ee}
.quote-details>summary>span{color:#e9c174}
.quote-details>summary>b{margin-left:auto;font-size:23px;font-weight:400;color:#e9c174}
.quote-details>p{font-size:15px;color:#abc2dd;line-height:1.9;max-width:1000px;padding-bottom:15px}
.summary-layout{display:grid;grid-template-columns:.8fr 1.2fr;gap:28px;align-items:start}
.summary-preview{background:#ffffff04;border:1px solid #e9c17435}
.summary-preview>img{width:100%;height:330px}
.summary-preview>div{padding:30px}
.summary-preview small{font-size:11px;letter-spacing:.15em;color:#e9c174}
.summary-preview h3{font-size:34px;margin:20px 0 15px}
.summary-preview p{font-size:17px;color:#bdd0e6;line-height:1.7}
.text-link{display:inline-block;border:0;background:transparent;color:#e9c174;padding:0;font-size:15px;margin-top:25px}
#project-enquiry{border:1px solid #ffffff25;background:#ffffff04;padding:30px}
.summary-head{display:flex;align-items:center;gap:17px;border-bottom:1px solid #e9c17445;padding-bottom:24px}
.summary-head>span{color:#e9c174}
.summary-head .v-icon{width:35px;height:35px}
.summary-head small{display:block;font-size:11px;letter-spacing:.15em;color:#e9c174}
.summary-head strong{display:block;font-size:19px;font-weight:500;margin-top:8px}
.project-summary{margin:6px 0 27px}
.summary-row{display:grid;grid-template-columns:.85fr 1.15fr;gap:25px;padding:13px 0;border-bottom:1px solid #ffffff15;line-height:1.7;font-size:15px}
.summary-row>span{color:#95b2d2}
.summary-row>b{font-weight:500;color:#dde9f7;overflow-wrap:anywhere;white-space:pre-wrap}
.summary-vr{display:flex;align-items:center;gap:12px;padding:16px;margin-top:18px;background:#ffb30010;border:1px solid #e9c17445;color:#edcd8d;font-size:15px}
#project-enquiry>.button{width:100%;margin-top:22px}
.enquiry-note{display:block;font-size:13px;color:#a4bedb;line-height:1.8;margin-top:17px}
.package-controls{display:flex;align-items:center;justify-content:space-between;gap:25px;padding-top:28px;margin-top:32px;border-top:1px solid #e9c17445}
#package-progress{font-size:14px;color:#adc4df;margin-right:auto}
.studio-assurances{display:flex;justify-content:center;align-items:center;gap:40px;flex-wrap:wrap;font-size:13px;color:#9fb9d5;margin-top:32px}
.studio-assurances>span{display:flex;align-items:center;gap:10px}
.studio-assurances i{color:#e9c174}
.studio-assurances .v-icon{width:19px;height:19px}
.package-footer{position:relative;padding:37px 0;background:#00152f;border-top:1px solid #e9c17430}
.package-footer>.wrap{display:flex;align-items:center;justify-content:space-between;gap:25px;flex-wrap:wrap}
.package-footer>.wrap>a:last-of-type{font-size:14px;color:#bdd0e6}
.package-footer small:not(.brand small){width:100%;font-size:12px;color:#809dbd;line-height:1.8;border-top:1px solid #ffffff12;padding-top:23px}
@media(min-width:1900px){.wrap{max-width:1800px}.tile-image{height:195px}.tile-copy{padding:23px}.tile-copy h3{font-size:18px}}
@media(max-width:1200px){.wrap{width:calc(100% - 64px)}.hero-window{width:290px;padding:28px}.hero-layout{gap:35px}.package-hero h1{font-size:62px}.project-types{grid-template-columns:repeat(2,minmax(0,1fr))}.tile-image{height:190px}.level-card{padding:24px}.level-card h3{font-size:29px}.config-layout{grid-template-columns:1.15fr .85fr;gap:22px}.config-form,.route-content{padding:25px}.package-steps button{gap:10px;padding:17px}.package-steps button>strong{font-size:15px}.package-steps button>i{display:none}.summary-preview>img{height:280px}}
@media(max-width:850px){.package-header{height:78px}.package-header nav{gap:17px}.package-header nav>a:nth-child(2){display:none}.brand>span{font-size:24px;gap:9px}.brand small{font-size:9px}.brand>img{width:28px;height:28px}.hero-window{display:none}.package-hero{min-height:540px;padding:65px 0 80px}.package-hero h1{font-size:64px}.hero-editorial{max-width:650px}.studio-intro{display:block}.studio-intro>p{max-width:650px;margin-top:24px}.studio-body{padding:26px}.section-heading{display:block}.section-heading>p{max-width:none;margin-top:20px}.config-layout,.summary-layout{grid-template-columns:1fr}.project-route{display:grid;grid-template-columns:.75fr 1.25fr}.route-cover{height:100%;min-height:300px}.route-content>p{display:none}.route-content{padding:25px}.level-grid{grid-template-columns:1fr}.level-card{padding:28px}.level-top{margin-bottom:20px}.level-card ul{margin:20px 0;display:grid;grid-template-columns:1fr 1fr;gap:5px 18px}.level-card h3{font-size:34px}.summary-preview{display:grid;grid-template-columns:.85fr 1fr}.summary-preview>img{height:100%;min-height:260px}.quest-option>b{display:none}.package-steps{gap:9px}.package-steps button{gap:9px;padding:14px 11px;min-height:70px}.package-steps button>strong{font-size:14px}.package-steps button>span{font-size:11px}.studio-assurances{gap:20px}.package-footer .brand>span{display:block}.package-footer .brand small{display:block}}
@media(max-width:580px){.wrap{width:calc(100% - 32px)}.package-header{height:72px;padding-inline:16px;gap:13px}.package-header nav>a:first-child{display:none}.package-header .nav-client{font-size:12px;padding:10px 13px}.brand>span{display:block;font-size:23px}.brand small{display:block;font-size:8px;line-height:1.2;margin-top:3px}.package-hero{min-height:530px;padding-block:58px 76px}.package-hero h1{font-size:clamp(43px,10.4vw,57px)}.package-hero .eyebrow{font-size:10px;letter-spacing:.13em}.hero-editorial>p:not(.eyebrow){font-size:17px;margin:25px 0}.hero-benefits{gap:15px;font-size:12px;margin-top:27px}.hero-reference{left:16px;right:16px;bottom:17px;font-size:9px;letter-spacing:.06em}.button{font-size:13px;padding:16px 18px;gap:12px}.package-studio{padding:45px 0 35px}.studio-intro{margin-bottom:28px}.studio-intro h2{font-size:38px}.studio-intro>p{font-size:16px;padding-left:18px}.eyebrow{font-size:10px;letter-spacing:.13em;margin-bottom:18px}.package-steps{grid-template-columns:1fr 1fr}.package-steps button{padding:14px;min-height:60px}.package-steps button>strong{font-size:14px}.studio-body{padding:24px 16px}.section-heading h2{font-size:34px}.section-heading>p{font-size:16px}.project-types{gap:14px}.tile-image{height:135px}.tile-copy{padding:16px 12px;min-height:110px;gap:9px;align-items:flex-start}.tile-icon{width:28px;height:28px;margin-top:3px}.tile-icon .v-icon{width:19px;height:19px}.tile-copy>i{display:none}.tile-copy small{font-size:10px}.tile-copy h3{font-size:15px}.config-form{padding:24px 17px}.config-form h3{font-size:31px}.config-common,#project-fields{grid-template-columns:1fr;gap:21px}.project-route,.summary-preview{display:block}.route-cover{height:230px;min-height:0}.route-content{padding:24px}.route-content>h3{font-size:30px}.route-content>p{display:block}.level-card{padding:25px 21px}.level-card h3{font-size:32px}.level-card ul{display:block}.level-top>small{font-size:10px}.level-symbol{width:42px;height:42px}.quest-option{padding:20px 16px;gap:13px;align-items:flex-start}.quest-option>input{margin-top:5px}.quest-option-icon{display:none}.quest-option strong{font-size:18px}.quest-option small{font-size:14px}.quote-details>summary{font-size:15px}.summary-preview>img{height:245px;min-height:0}.summary-preview>div{padding:24px}.summary-preview h3{font-size:31px}.summary-row{grid-template-columns:1fr;gap:4px;padding:14px 0}.summary-head strong{font-size:18px}#project-enquiry{padding:24px 19px}.package-controls{flex-wrap:wrap;gap:14px;justify-content:space-between}.package-controls>#package-progress{order:-1;width:100%;margin:0}.package-controls>.button{flex:1;padding:14px 12px;font-size:12px}.studio-assurances{justify-content:flex-start;gap:13px;padding-inline:5px}.package-footer{padding:28px 0}.package-footer .brand>span{font-size:22px}.package-footer>.wrap>a:last-of-type{font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}.project-tile:hover .tile-image>img{transform:none}}
