/* =========================================================
   IdentiBasics — Premium Static Site
   Archetype: Brutalist Editorial (negro / amarillo), adaptado
   de la identidad visual real de @identibasics (Instagram).
   ========================================================= */

:root{
  --black:#0a0a0a;
  --black2:#121212;
  --panel:#191919;
  --panel2:#1f1f1f;
  --yellow:#FFC400;
  --yellow-deep:#E6AF00;
  --white:#ffffff;
  --gray:#9c9c9c;
  --gray-dim:#6b6b6b;
  --line:#2a2a2a;
  --green:#25D366;
  --radius:20px;
  --maxw:1240px;
  --ease:cubic-bezier(.16,.84,.32,1);
}

*,*::before,*::after{box-sizing:border-box;}
*{margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--black);
  color:var(--white);
  font-family:'Inter',-apple-system,sans-serif;
  line-height:1.5;
  overflow-x:clip;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,.display{
  font-family:'Anton',sans-serif;
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.3px;
  line-height:1.02;
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
ul{list-style:none;}
button{font-family:inherit;background:none;border:none;color:inherit;cursor:pointer;}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 28px;}
::selection{background:var(--yellow);color:var(--black);}

/* ---------- grain overlay ---------- */
.grain{
  position:fixed;inset:0;z-index:9999;pointer-events:none;
  opacity:.045;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- custom cursor (desktop, fine pointer only) ---------- */
@media (hover:hover) and (pointer:fine){
  body{cursor:none;}
  .cursor-dot,.cursor-ring{
    position:fixed;top:0;left:0;z-index:9998;pointer-events:none;
    border-radius:50%;transform:translate(-50%,-50%);
    transition:opacity .2s;
  }
  .cursor-dot{width:6px;height:6px;background:var(--yellow);}
  .cursor-ring{
    width:36px;height:36px;border:1.5px solid rgba(255,196,0,.55);
    transition:transform .15s var(--ease),opacity .2s,width .2s,height .2s,background .2s;
  }
  .cursor-ring.is-active{
    background:rgba(255,196,0,.12);
    width:64px;height:64px;
  }
}
@media (hover:none),(pointer:coarse){
  .cursor-dot,.cursor-ring{display:none;}
}

/* ---------- splash ---------- */
.splash{
  position:fixed;inset:0;z-index:10000;background:var(--black);
  display:flex;align-items:center;justify-content:center;
  animation:splashOut .7s var(--ease) forwards 1.6s;
}
.splash-mark{
  font-family:'Anton',sans-serif;font-size:15vw;color:var(--yellow);
  animation:splashPulse 1.4s var(--ease) infinite alternate;
}
@keyframes splashPulse{ from{opacity:.35;transform:scale(.94);} to{opacity:1;transform:scale(1);} }
@keyframes splashOut{ to{opacity:0;visibility:hidden;pointer-events:none;} }

/* ---------- reveal defensive base (gotcha A.4.5) ---------- */
.reveal{opacity:1;transform:none;}
.reveal[data-split],.reveal[data-reveal]{
  opacity:1;transform:none; /* never rely solely on JS to show content */
}
.js .reveal[data-reveal]{
  opacity:0;transform:translateY(28px);
  transition:opacity .8s var(--ease),transform .8s var(--ease);
}
.js .reveal[data-reveal].is-visible{opacity:1;transform:none;}
.js .reveal[data-split] .word{
  display:inline-block;opacity:0;transform:translateY(100%) rotate(2deg);
  transition:opacity .6s var(--ease),transform .6s var(--ease);
}
.js .reveal[data-split].is-visible .word{opacity:1;transform:none;}

/* ---------- header ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:500;
  padding:20px 0;transition:background .35s,padding .35s,border-color .35s;
  border-bottom:1px solid transparent;
}
.site-header.is-scrolled{
  background:rgba(10,10,10,.86);backdrop-filter:blur(14px);
  padding:14px 0;border-color:var(--line);
}
.header-inner{
  max-width:var(--maxw);margin:0 auto;padding:0 28px;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
}
.brand{display:flex;align-items:center;gap:10px;}
.brand-mark{
  width:38px;height:38px;border-radius:10px;background:var(--yellow);color:var(--black);
  font-family:'Anton';display:flex;align-items:center;justify-content:center;font-size:16px;flex-shrink:0;
}
.brand-word{font-family:'Anton';font-size:18px;letter-spacing:.3px;}
.brand-word em{font-style:normal;color:var(--yellow);}
.main-nav{display:flex;gap:30px;font-weight:600;font-size:13.5px;text-transform:uppercase;letter-spacing:.6px;align-items:center;}
.main-nav a{opacity:.7;transition:opacity .2s,color .2s;position:relative;}
.main-nav a:hover,.main-nav a.active{opacity:1;color:var(--yellow);}
.mobile-nav a.active{color:var(--yellow);}

/* ---------- nav dropdown: Productos ---------- */
.nav-dropdown{position:relative;}
.nav-dropdown-toggle{
  display:inline-flex;align-items:center;gap:5px;opacity:.7;cursor:pointer;
  transition:opacity .2s,color .2s;user-select:none;
}
.nav-dropdown-toggle svg{width:10px;height:10px;transition:transform .25s var(--ease);}
.nav-dropdown:hover .nav-dropdown-toggle,.nav-dropdown-toggle.active{opacity:1;color:var(--yellow);}
.nav-dropdown:hover .nav-dropdown-toggle svg{transform:rotate(180deg);}
.nav-dropdown-menu{
  position:absolute;top:100%;left:50%;transform:translate(-50%,6px);margin-top:14px;
  background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:8px;
  min-width:150px;box-shadow:0 18px 40px rgba(0,0,0,.45);
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .2s var(--ease),transform .2s var(--ease),visibility 0s .2s;
  text-align:left;
}
.nav-dropdown:hover .nav-dropdown-menu{
  opacity:1;visibility:visible;pointer-events:auto;transform:translate(-50%,0);
  transition:opacity .2s var(--ease),transform .2s var(--ease);
}
.nav-dropdown-menu a{
  display:block;padding:10px 14px;border-radius:9px;font-size:13.5px;
  opacity:.85;white-space:nowrap;
}
.nav-dropdown-menu a:hover,.nav-dropdown-menu a.active{background:rgba(255,196,0,.1);opacity:1;color:var(--yellow);}

/* ---------- mobile nav: Productos accordion ---------- */
.mobile-nav-dropdown{display:flex;flex-direction:column;align-items:center;gap:0;}
.mobile-nav-dropdown-toggle{
  display:inline-flex;align-items:center;gap:10px;background:none;border:none;
  font-family:'Anton';font-size:32px;text-transform:uppercase;color:var(--white);cursor:pointer;
}
.mobile-nav-dropdown-toggle svg{width:18px;height:18px;transition:transform .3s var(--ease);}
.mobile-nav-dropdown.is-open .mobile-nav-dropdown-toggle svg{transform:rotate(180deg);}
.mobile-nav-dropdown.is-open .mobile-nav-dropdown-toggle{color:var(--yellow);}
.mobile-nav-dropdown-menu{
  max-height:0;overflow:hidden;display:flex;flex-direction:column;align-items:center;
  transition:max-height .3s var(--ease);
}
.mobile-nav-dropdown.is-open .mobile-nav-dropdown-menu{max-height:200px;}
.mobile-nav-dropdown-menu a{font-family:'Inter';font-size:18px;font-weight:700;text-transform:uppercase;
  color:var(--gray);padding:12px 0;}
.mobile-nav-dropdown-menu a.active{color:var(--yellow);}
.btn-wa{
  display:inline-flex;align-items:center;gap:8px;background:var(--green);color:#fff;
  font-weight:700;font-size:13.5px;padding:11px 20px;border-radius:999px;
  box-shadow:0 4px 14px rgba(37,211,102,.28);transition:transform .25s,box-shadow .25s;
}
.btn-wa:hover{transform:translateY(-2px);box-shadow:0 10px 22px rgba(37,211,102,.38);}
.nav-toggle{display:none;flex-direction:column;gap:5px;width:30px;}
.nav-toggle span{height:2px;background:var(--white);border-radius:2px;transition:transform .3s,opacity .3s;}
@media (max-width:900px){
  .main-nav{display:none;}
  .header-inner .btn-wa{display:none;}
  .nav-toggle{display:flex;}
}

/* ---------- mobile nav drawer ---------- */
.mobile-nav{
  position:fixed;inset:0;z-index:490;background:var(--black);
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:30px;
  opacity:0;visibility:hidden;transform:translateY(-12px);
  transition:opacity .35s var(--ease),transform .35s var(--ease),visibility 0s .35s;
}
.mobile-nav.is-open{opacity:1;visibility:visible;transform:none;transition:opacity .35s var(--ease),transform .35s var(--ease);}
.mobile-nav a{font-family:'Anton';font-size:32px;text-transform:uppercase;}
.mobile-nav .btn-wa{margin-top:10px;}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:15px;
  padding:17px 28px;border-radius:12px;position:relative;overflow:hidden;
}
.btn-yellow{background:var(--yellow);color:var(--black);}
.btn-ghost{background:transparent;color:var(--white);border:1.5px solid var(--line);}
.btn-ghost:hover{border-color:var(--yellow);color:var(--yellow);}
.magnetic{transition:transform .25s var(--ease),box-shadow .25s;}
.btn-yellow.magnetic:hover{box-shadow:0 12px 30px rgba(255,196,0,.3);}

/* ---------- hero ---------- */
.hero{
  position:relative;min-height:100svh;display:flex;flex-direction:column;justify-content:center;
  padding:140px 0 80px;overflow:hidden;
}
.hero-bg{
  position:absolute;inset:0;z-index:0;
  background:
    radial-gradient(circle 620px at var(--mx,80%) var(--my,10%), rgba(255,196,0,.16), transparent 60%),
    linear-gradient(180deg,#0a0a0a 0%,#0c0c0a 60%,#0a0a0a 100%);
  transition:background .4s;
}
.hero-bg::before{
  content:"";position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse 70% 60% at 50% 30%,#000 40%,transparent 100%);
}
.hero-stripe{
  position:absolute;right:-10%;top:-15%;width:60%;aspect-ratio:1;
  background:var(--yellow);opacity:.05;transform:rotate(18deg);border-radius:80px;z-index:0;
}
.hero-content{position:relative;z-index:2;max-width:var(--maxw);margin:0 auto;padding:0 28px;width:100%;text-align:center;display:flex;flex-direction:column;align-items:center;}
.eyebrow{
  display:inline-flex;align-items:center;gap:9px;background:var(--panel);border:1px solid var(--line);
  color:var(--yellow);font-weight:700;font-size:12px;letter-spacing:1.2px;text-transform:uppercase;
  padding:9px 16px;border-radius:999px;margin-bottom:30px;
}
.eyebrow::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 3px rgba(255,196,0,.25);}
.hero-title{font-size:clamp(46px,8vw,108px);max-width:1080px;margin:0 auto;}
.hero-title .hl{color:var(--yellow);display:block;}
.hero-sub{margin:28px auto 0;font-size:clamp(16px,2vw,19px);color:#d4d4d4;max-width:560px;font-weight:500;}
.hero-cta{display:flex;gap:16px;margin-top:44px;flex-wrap:wrap;justify-content:center;}
.scroll-cue{
  position:absolute;bottom:36px;left:50%;transform:translateX(-50%);z-index:2;
  display:flex;flex-direction:column;align-items:center;gap:10px;
  font-size:11px;letter-spacing:2px;text-transform:uppercase;color:var(--gray-dim);
}
.scroll-cue span{
  width:1px;height:34px;background:linear-gradient(var(--yellow),transparent);
  animation:scrollCue 1.8s ease-in-out infinite;
}
@keyframes scrollCue{0%{transform:scaleY(0);transform-origin:top;} 50%{transform:scaleY(1);transform-origin:top;} 50.01%{transform-origin:bottom;} 100%{transform:scaleY(0);transform-origin:bottom;}}

/* ---------- marquee ---------- */
.marquee-strip{
  background:var(--yellow);color:var(--black);overflow:hidden;
  border-top:1px solid var(--yellow-deep);border-bottom:1px solid var(--yellow-deep);
  padding:16px 0;position:relative;z-index:3;
}
.marquee-track{display:flex;width:max-content;animation:marquee 26s linear infinite;}
.marquee-track span{
  font-family:'Anton';font-size:20px;padding:0 22px;white-space:nowrap;letter-spacing:.5px;
}
@keyframes marquee{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* ---------- page hero (subpáginas: remeras, buzos, precios, nosotros) ---------- */
.page-hero{
  position:relative;padding:168px 0 64px;background:var(--black);overflow:hidden;
}
.page-hero .hero-bg{position:absolute;inset:0;z-index:0;}
.page-hero-content{position:relative;z-index:2;}
.page-title{font-size:clamp(34px,5.4vw,64px);max-width:820px;margin:16px 0 18px;}
.page-sub{color:#d4d4d4;font-size:16px;max-width:620px;line-height:1.65;font-weight:500;}
.page-cross-link{display:inline-block;margin-top:22px;font-size:14px;font-weight:700;color:var(--yellow);text-decoration:none;}
.page-cross-link:hover{text-decoration:underline;}
@media (max-width:600px){.page-hero{padding:138px 0 50px;}}

/* ---------- menu grid (home) ---------- */
.menu-section{padding:110px 0 130px;background:var(--black);}
.menu-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px;margin-top:56px;}
.menu-card{
  display:block;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:38px 34px;transition:transform .35s var(--ease),border-color .35s,background .35s;
}
.menu-card:hover{transform:translateY(-8px);border-color:var(--yellow);background:var(--panel2);}
.menu-card-icon{font-size:32px;margin-bottom:20px;display:block;}
.menu-card h3{font-size:24px;margin-bottom:10px;}
.menu-card p{color:var(--gray);font-size:14.5px;line-height:1.6;margin-bottom:20px;}
.menu-card-link{display:inline-flex;align-items:center;gap:8px;color:var(--yellow);font-weight:700;font-size:13.5px;text-transform:uppercase;letter-spacing:.5px;}
.menu-card:hover .menu-card-link{gap:12px;}
.menu-card-link svg{transition:transform .25s var(--ease);}
.menu-card:hover .menu-card-link svg{transform:translateX(3px);}
.menu-grid .menu-card:last-child:nth-child(odd){grid-column:1/-1;}
@media (max-width:760px){.menu-grid{grid-template-columns:1fr;}.menu-grid .menu-card:last-child:nth-child(odd){grid-column:auto;}}

/* ---------- single-item grid helpers (subpáginas de un solo producto) ---------- */
.gallery-grid.single{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto;}
.tables-grid.single{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto;}

/* ---------- generic section chrome ---------- */
section{position:relative;}
.section-tag{color:var(--yellow);font-weight:700;font-size:13px;letter-spacing:1.6px;text-transform:uppercase;margin-bottom:14px;}
.section-title{font-size:clamp(30px,4.2vw,48px);max-width:700px;}
.section-head{margin-bottom:56px;}

/* ---------- steps ---------- */
.steps-section{padding:120px 0;background:var(--black2);border-bottom:1px solid var(--line);}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;margin-top:56px;}
.step-card{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:38px 32px;transition:transform .35s var(--ease),border-color .35s;
}
.step-card:hover{transform:translateY(-8px);border-color:var(--yellow);}
.step-num{font-family:'Anton';font-size:52px;color:var(--yellow);opacity:.32;margin-bottom:18px;}
.step-card h3{font-size:20px;margin-bottom:12px;}
.step-card p{color:var(--gray);font-size:15px;line-height:1.65;}
@media (max-width:860px){.steps-grid{grid-template-columns:1fr;}}

/* ---------- calculator ---------- */
.calc-section{padding:130px 0;background:var(--black);}
.calc-grid{
  display:grid;grid-template-columns:1.05fr .95fr;margin-top:56px;
  border-radius:26px;overflow:hidden;border:1px solid var(--line);
}
.calc-panel{background:var(--panel);padding:48px;}
.calc-result{
  background:linear-gradient(160deg,#171402 0%,#0a0a0a 55%);
  padding:48px;display:flex;flex-direction:column;justify-content:center;
  border-left:1px solid var(--line);
}
.field-label{font-size:12.5px;font-weight:700;letter-spacing:1px;text-transform:uppercase;color:var(--gray);margin-bottom:13px;display:block;}
.field{margin-bottom:32px;}
.toggle-row{display:flex;gap:10px;}
.toggle-btn{
  flex:1;padding:17px 12px;text-align:center;border-radius:12px;background:#151515;
  border:1.5px solid var(--line);color:var(--gray);font-weight:700;font-size:14.5px;
  cursor:pointer;transition:all .2s;
}
.toggle-btn.active{background:var(--yellow);border-color:var(--yellow);color:var(--black);}
.toggle-btn:hover:not(.active){border-color:#555;color:var(--white);}
.qty-row{display:flex;align-items:center;gap:14px;}
.qty-btn{
  width:48px;height:48px;border-radius:12px;background:#151515;border:1.5px solid var(--line);
  color:var(--white);font-size:21px;font-weight:700;cursor:pointer;transition:all .2s;
  display:flex;align-items:center;justify-content:center;
}
.qty-btn:hover{border-color:var(--yellow);color:var(--yellow);}
.qty-input{
  flex:1;text-align:center;font-family:'Anton';font-size:25px;background:#151515;
  border:1.5px solid var(--line);border-radius:12px;color:var(--white);padding:11px;width:100%;
}
select.qty-input{
  font-family:'Inter';font-size:15px;font-weight:600;text-align:left;padding:15px 16px;appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9'%3E%3Cpath d='M1 1l6 6 6-6' stroke='%23FFC400' stroke-width='2' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 16px center;
}
.hint{font-size:13px;color:var(--gray);margin-top:11px;line-height:1.5;}
.hint.warn{color:var(--yellow);}
.field-label-sub{font-style:normal;text-transform:none;letter-spacing:0;font-weight:600;color:#6b6b6b;font-size:11.5px;margin-left:6px;}
.color-row{display:flex;flex-wrap:wrap;gap:12px;}
.color-swatch{
  width:32px;height:32px;border-radius:50%;background:var(--sw);
  border:1.5px solid rgba(255,255,255,.16);padding:0;cursor:pointer;flex-shrink:0;
  box-shadow:inset 0 0 0 2px rgba(0,0,0,.15);
  transition:transform .18s ease,box-shadow .18s ease;
}
.color-swatch.is-light{border-color:rgba(0,0,0,.18);}
.color-swatch:hover{transform:scale(1.14);}
.color-swatch.active{box-shadow:0 0 0 2px var(--black2),0 0 0 4px var(--yellow);}
.color-swatch:focus-visible{outline:2px solid var(--yellow);outline-offset:3px;}

/* ---------- variant rows (combinar producto + talle + color dentro del mismo pedido) ---------- */
.variant-list{display:flex;flex-direction:column;gap:12px;margin-bottom:14px;}
.variant-row{
  position:relative;
  background:#151515;border:1.5px solid var(--line);border-radius:14px;padding:16px;
}
.variant-row-top{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:12px;padding-right:30px;}
.variant-producto{width:96px;flex:0 0 auto;padding:10px 24px 10px 12px;font-size:14px;background-position:right 8px center;}
.variant-talle{width:80px;flex:0 0 auto;padding:10px 24px 10px 12px;font-size:14px;background-position:right 8px center;}
.variant-colors{display:flex;flex-wrap:wrap;gap:7px;}
.color-swatch.mini{width:19px;height:19px;}
.variant-qty{gap:8px;flex:0 0 auto;}
.variant-qty .qty-btn{width:30px;height:30px;border-radius:9px;font-size:16px;}
.variant-qty .qty-input{width:42px;flex:none;font-size:15px;padding:7px;border-radius:9px;}
.variant-remove{
  position:absolute;top:14px;right:14px;width:24px;height:24px;border-radius:50%;padding:0;
  display:flex;align-items:center;justify-content:center;background:transparent;
  border:1.5px solid var(--line);color:var(--gray-dim);cursor:pointer;transition:all .2s;flex:0 0 auto;
}
.variant-remove:hover{border-color:#e5484d;color:#e5484d;}
.variant-add{
  display:flex;align-items:center;justify-content:center;gap:8px;background:transparent;
  border:1.5px dashed var(--line);border-radius:12px;padding:13px 18px;width:100%;
  color:var(--yellow);font-weight:700;font-size:13.5px;cursor:pointer;transition:all .2s;margin-bottom:16px;
}
.variant-add:hover{border-color:var(--yellow);background:rgba(255,196,0,.06);}
.variant-total{font-size:13.5px;color:var(--gray);margin-bottom:2px;}
.variant-total b{color:var(--white);}
@media (max-width:520px){
  .variant-producto,.variant-talle{width:auto;flex:1 1 76px;}
}

/* ---------- order summary (desglose por producto en el resultado) ---------- */
.order-summary{margin-bottom:6px;}
.summary-row{
  display:flex;justify-content:space-between;align-items:flex-start;gap:14px;
  padding:14px 0;border-bottom:1px solid var(--line);
}
.summary-row:first-child{padding-top:0;}
.summary-label{font-size:14.5px;color:var(--white);font-weight:600;}
.summary-label small{display:block;color:var(--gray);font-weight:500;font-size:12px;margin-top:3px;}
.summary-value{font-family:'Anton';font-size:19px;color:var(--yellow);white-space:nowrap;flex-shrink:0;}

/* ---------- calc CTA banner (remeras.html / buzos.html → cotizar.html) ---------- */
.calc-cta-section{padding:90px 0;background:var(--black);}
.calc-cta-panel{
  background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);
  padding:46px 50px;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap;
}
.calc-cta-panel h2{font-size:clamp(24px,3vw,32px);margin:12px 0 12px;max-width:520px;}
.calc-cta-panel p{color:var(--gray);font-size:15px;line-height:1.65;max-width:460px;}
.calc-cta-panel .btn{flex-shrink:0;}
@media (max-width:760px){.calc-cta-panel{padding:36px 28px;}}
.result-badge{
  display:inline-block;background:rgba(255,196,0,.12);color:var(--yellow);font-weight:700;
  font-size:12.5px;letter-spacing:.6px;text-transform:uppercase;padding:7px 14px;border-radius:999px;
  margin-bottom:22px;width:fit-content;
}
.price-unit{font-size:15px;color:var(--gray);font-weight:600;}
.price-main{font-family:'Anton';font-size:clamp(50px,6vw,66px);margin:8px 0 6px;}
.price-main span{color:var(--yellow);}
.price-sub{font-size:14px;color:var(--gray);margin-bottom:28px;}
.price-total-row{
  display:flex;justify-content:space-between;align-items:baseline;
  border-top:1px solid var(--line);padding-top:24px;margin-bottom:30px;
}
.price-total-label{font-size:13.5px;color:var(--gray);font-weight:700;text-transform:uppercase;letter-spacing:.5px;}
.price-total-num{font-family:'Anton';font-size:31px;color:var(--yellow);}
.price-tag-from{display:inline-block;font-family:'Inter';font-size:11.5px;font-weight:700;color:var(--gray);text-transform:uppercase;letter-spacing:.6px;margin-right:7px;vertical-align:3px;}
.calc-notes{font-size:13px;color:var(--gray);line-height:1.7;margin-bottom:28px;}
.calc-notes b{color:#ddd;}
.calc-shipping-link{
  display:flex;align-items:center;justify-content:center;gap:8px;
  margin-top:16px;font-size:13.5px;font-weight:600;color:var(--gray);
  text-decoration:none;transition:color .2s ease;
}
.calc-shipping-link svg{flex-shrink:0;}
.calc-shipping-link:hover{color:var(--yellow);}
@media (max-width:960px){
  .calc-grid{grid-template-columns:1fr;}
  .calc-result{border-left:none;border-top:1px solid var(--line);}
  .calc-panel,.calc-result{padding:32px 24px;}
}

/* ---------- gallery ---------- */
.gallery-section{padding:130px 0;background:var(--black2);border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:56px;}
.gallery-card{
  border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
  background:var(--panel);position:relative;
  clip-path:inset(0 0 0 0);
}
.gallery-card .img-wrap{overflow:hidden;aspect-ratio:4/5;}
.gallery-card img{
  width:100%;height:100%;object-fit:cover;display:block;
  transform:scale(1.12);transition:transform .8s var(--ease);
}
.gallery-card:hover img{transform:scale(1);}
.gallery-card figcaption{
  position:absolute;left:0;right:0;bottom:0;padding:24px 26px 22px;
  background:linear-gradient(0deg,rgba(0,0,0,.88) 0%,rgba(0,0,0,.5) 60%,transparent 100%);
  font-size:13.5px;color:#ddd;
}
.gallery-card figcaption span{display:block;font-family:'Anton';font-size:23px;color:var(--yellow);margin-bottom:5px;}
@media (max-width:860px){.gallery-grid{grid-template-columns:1fr;}}

/* ---------- portfolio (trabajos personalizados) ---------- */
.portfolio-section{padding:130px 0;background:var(--black);}
.portfolio-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:56px;}
.portfolio-card{
  background:#f2f0ea;border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);
  transition:transform .35s var(--ease),box-shadow .35s var(--ease);
}
.portfolio-card:hover{transform:translateY(-6px);box-shadow:0 20px 40px rgba(0,0,0,.35);}
.portfolio-img-wrap{background:#f2f0ea;display:flex;align-items:center;justify-content:center;padding:22px 22px 0;}
.portfolio-img-wrap img{width:100%;height:auto;display:block;}
.portfolio-card figcaption{padding:18px 24px 24px;color:#181818;font-size:13.5px;line-height:1.5;}
.portfolio-card figcaption span{display:block;font-family:'Anton';font-size:19px;color:#0a0a0a;margin-bottom:4px;letter-spacing:.3px;}
.portfolio-note{margin-top:48px;text-align:center;color:var(--gray);font-size:14.5px;}
.portfolio-note a{color:var(--yellow);font-weight:700;text-decoration:none;}
.portfolio-note a:hover{text-decoration:underline;}
@media (max-width:860px){.portfolio-grid{grid-template-columns:1fr;}}

/* ---------- pricing tables ---------- */
.tables-section{padding:130px 0;background:var(--black);}
.tables-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;margin-top:56px;}
.price-card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;}
.price-card-head{background:var(--yellow);color:var(--black);padding:23px 30px;display:flex;align-items:center;justify-content:space-between;}
.price-card-head h3{font-size:23px;}
.price-card-head span{font-weight:700;font-size:13px;text-transform:uppercase;}
.price-rows{padding:8px 30px 28px;}
.price-row{display:flex;justify-content:space-between;align-items:center;padding:19px 0;border-bottom:1px solid var(--line);}
.price-row:last-child{border-bottom:none;}
.price-row-label{font-weight:600;font-size:15px;}
.price-row-label small{display:block;color:var(--gray);font-weight:500;font-size:12.5px;margin-top:3px;}
.price-row-value{font-family:'Anton';font-size:21px;color:var(--yellow);white-space:nowrap;}
.surcharge-note{
  margin:20px 30px 28px;padding:15px 17px;background:rgba(255,196,0,.08);
  border:1px solid rgba(255,196,0,.25);border-radius:10px;font-size:13px;color:#e8d38a;
}
@media (max-width:860px){.tables-grid{grid-template-columns:1fr;}}

/* ---------- why / stats ---------- */
.why-section{padding:130px 0;background:var(--black2);border-top:1px solid var(--line);}
.stats-row{
  display:grid;grid-template-columns:repeat(4,1fr);gap:24px;margin:56px 0 70px;
  padding-bottom:60px;border-bottom:1px solid var(--line);
}
.stat-num{font-family:'Anton';font-size:clamp(36px,4vw,52px);color:var(--yellow);}
.stat-label{font-size:12.5px;color:var(--gray);font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-top:6px;}
.why-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px;}
.why-card{background:var(--panel);border:1px solid var(--line);border-radius:16px;padding:30px 24px;transition:transform .3s var(--ease),border-color .3s;}
.why-card:hover{transform:translateY(-6px);border-color:var(--yellow);}
.why-icon{width:46px;height:46px;border-radius:12px;background:rgba(255,196,0,.12);display:flex;align-items:center;justify-content:center;margin-bottom:18px;font-size:21px;}
.why-shipping-link{color:var(--yellow);font-weight:700;text-decoration:none;white-space:nowrap;}
.why-shipping-link:hover{text-decoration:underline;}
.why-card h3{font-size:16.5px;margin-bottom:9px;font-family:'Inter';text-transform:none;font-weight:800;}
.why-card p{font-size:13.5px;color:var(--gray);line-height:1.6;}
@media (max-width:980px){.stats-row,.why-grid{grid-template-columns:1fr 1fr;}}
@media (max-width:560px){.stats-row,.why-grid{grid-template-columns:1fr;}}

/* ---------- final cta ---------- */
.final-cta{
  margin:0 28px 110px;padding:90px 48px;border-radius:32px;text-align:center;
  background:linear-gradient(135deg,#1c1a05,#0a0a0a 70%);
  border:1px solid var(--line);position:relative;overflow:hidden;
}
.final-cta::before{
  content:"";position:absolute;width:480px;height:480px;background:var(--yellow);opacity:.07;
  border-radius:50%;top:-220px;left:-140px;
}
.final-cta h2{font-size:clamp(32px,5.5vw,56px);position:relative;z-index:2;}
.final-cta p{color:var(--gray);margin:20px auto 38px;max-width:500px;font-size:16.5px;position:relative;z-index:2;}
.final-cta .btn{position:relative;z-index:2;}

/* ---------- footer ---------- */
footer{padding:56px 0 44px;border-top:1px solid var(--line);}
.footer-grid{display:flex;justify-content:space-between;flex-wrap:wrap;gap:34px;}
.footer-brand p{color:var(--gray);font-size:13.5px;margin-top:12px;max-width:320px;line-height:1.65;}
.footer-col h4{font-size:13px;text-transform:uppercase;letter-spacing:1px;color:var(--gray);margin-bottom:15px;font-weight:700;}
.footer-col a,.footer-col p{display:block;font-size:14px;margin-bottom:10px;color:#ccc;}
.footer-col a:hover{color:var(--yellow);}
.footer-bottom{
  margin-top:44px;padding-top:26px;border-top:1px solid var(--line);
  font-size:12.5px;color:#666;display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
}

/* ---------- floating whatsapp ---------- */
.float-wa{
  position:fixed;bottom:28px;right:28px;z-index:200;
  background:var(--green);color:#fff;width:60px;height:60px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  box-shadow:0 8px 24px rgba(37,211,102,.4);transition:transform .25s;
}
.float-wa:hover{transform:scale(1.08);}
.float-wa svg{width:29px;height:29px;}

/* ---------- utility / responsive ---------- */
@media (max-width:600px){
  .hero{padding:120px 0 60px;}
  .calc-panel,.calc-result{padding:28px 20px;}
  .final-cta{padding:56px 24px;margin:0 16px 80px;border-radius:24px;}
  .marquee-track span{font-size:16px;padding:0 14px;}
}
