:root{
  --teal:#3BBFA0;--teal-dark:#28917A;
  --gold:#F5A623;--gold-dark:#C47D0A;
  --navy:#1B2A4A;--navy-mid:#273D6A;
  --off-white:#F7F5F0;--white:#fff;
  --text-muted:#6B7280;--border:rgba(27,42,74,0.11);
  --font-head:'League Spartan',sans-serif;
  --font-body:'Inter',sans-serif;
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--font-body);background:var(--off-white);color:#111;overflow-x:hidden;}

/* ── NAV ── */
nav{position:fixed;top:0;left:0;right:0;z-index:200;display:flex;align-items:center;justify-content:space-between;padding:20px 60px;background:transparent;transition:background .4s,padding .4s;}
nav.scrolled{background:rgba(27,42,74,0.97);padding:14px 60px;backdrop-filter:blur(10px);}
.logo-mark{display:flex;align-items:center;gap:12px;text-decoration:none;}
.logo-text-wrap{display:flex;flex-direction:column;line-height:1;}
.logo-sumko{font-family:var(--font-head);font-weight:700;font-size:19px;letter-spacing:.14em;color:#fff;text-transform:uppercase;}
.logo-sub{font-size:8px;letter-spacing:.2em;color:rgba(255,255,255,.45);text-transform:uppercase;font-family:var(--font-body);margin-top:3px;}
.nav-links{display:flex;gap:36px;list-style:none;}
.nav-links a{color:rgba(255,255,255,.75);text-decoration:none;font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:500;font-family:var(--font-body);transition:color .2s;padding-bottom:2px;border-bottom:1px solid transparent;}
.nav-links a:hover{color:var(--gold);border-bottom-color:var(--gold);}
.nav-cta{background:var(--gold)!important;color:var(--navy)!important;padding:9px 22px!important;border-radius:3px;font-weight:600!important;border-bottom:none!important;transition:background .2s!important;}
.nav-cta:hover{background:var(--gold-dark)!important;color:#fff!important;}

/* ── HERO ── */
#inicio{min-height:100vh;background:var(--navy);position:relative;display:flex;align-items:center;overflow:hidden;}
.hero-bg{position:absolute;inset:0;pointer-events:none;}
.hero-content{position:relative;z-index:2;padding:140px 60px 80px;max-width:740px;}
.hero-eyebrow{display:flex;align-items:center;gap:12px;margin-bottom:24px;opacity:0;animation:fadeUp .8s ease .2s forwards;}
.eyebrow-line{width:36px;height:1.5px;background:var(--teal);}
.eyebrow-text{font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);font-family:var(--font-body);font-weight:500;}
.hero-title{font-family:var(--font-head);font-size:clamp(44px,6.5vw,82px);font-weight:800;line-height:1;letter-spacing:-.01em;color:#fff;margin-bottom:24px;opacity:0;animation:fadeUp .9s ease .4s forwards;text-transform:uppercase;}
.hero-title em{font-style:normal;color:var(--gold);}
.hero-desc{font-size:16px;line-height:1.8;color:rgba(255,255,255,.55);max-width:480px;margin-bottom:44px;font-weight:300;opacity:0;animation:fadeUp .9s ease .6s forwards;}
.hero-actions{display:flex;gap:14px;align-items:center;opacity:0;animation:fadeUp .9s ease .8s forwards;}
.btn-primary{background:var(--gold);color:var(--navy);padding:14px 30px;border-radius:3px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:background .2s,transform .15s;font-family:var(--font-body);}
.btn-primary:hover{background:var(--gold-dark);transform:translateY(-2px);}
.btn-ghost{color:rgba(255,255,255,.6);font-size:12px;text-decoration:none;letter-spacing:.1em;text-transform:uppercase;display:flex;align-items:center;gap:8px;transition:color .2s;font-family:var(--font-body);font-weight:500;}
.btn-ghost:hover{color:#fff;}
.btn-ghost::after{content:'→';font-size:15px;}
.hero-right{position:absolute;right:0;top:0;bottom:0;width:44%;display:flex;flex-direction:column;justify-content:flex-end;padding:60px;opacity:0;animation:fadeIn 1.2s ease 1s forwards;}
.hero-stats-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.07);border-radius:6px;overflow:hidden;}
.stat-box{background:rgba(255,255,255,.04);padding:32px 28px;border:1px solid rgba(255,255,255,.06);}
.stat-number{font-family:var(--font-head);font-size:54px;font-weight:800;color:var(--gold);line-height:1;margin-bottom:8px;display:flex;align-items:baseline;gap:2px;letter-spacing:-.02em;}
.stat-int{display:inline-block;min-width:2ch;}
.stat-suffix{font-size:32px;font-weight:700;}
.stat-label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.35);font-family:var(--font-body);}
.geo-float{position:absolute;width:0;height:0;animation:floatY 7s ease-in-out infinite;}
.geo-float.teal{right:44%;top:14%;border-left:56px solid transparent;border-right:56px solid transparent;border-bottom:96px solid rgba(59,191,160,.08);}
.geo-float.gold{right:40%;bottom:18%;border-left:36px solid transparent;border-right:36px solid transparent;border-bottom:62px solid rgba(245,166,35,.07);animation-delay:1.5s;}

/* ── SHARED ── */
section{padding:100px 60px;}
.section-label{display:flex;align-items:center;gap:12px;margin-bottom:16px;}
.section-label::before{content:'';width:28px;height:1.5px;background:var(--teal);}
.section-label span{font-size:10px;letter-spacing:.22em;text-transform:uppercase;color:var(--teal);font-weight:600;font-family:var(--font-body);}
.section-title{font-family:var(--font-head);font-size:clamp(32px,4.5vw,56px);font-weight:800;line-height:1.05;color:var(--navy);margin-bottom:14px;text-transform:uppercase;letter-spacing:-.01em;}
.section-title em{font-style:normal;color:var(--gold);}
.section-desc{font-size:15px;color:var(--text-muted);line-height:1.8;max-width:500px;font-weight:300;}

/* ── SERVICIOS ── */
#servicios{background:#fff;}
.servicios-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));gap:2px;background:var(--border);margin-top:56px;}
.servicio-card{background:#fff;padding:44px 36px;position:relative;overflow:hidden;transition:transform .3s,box-shadow .3s;}
.servicio-card::after{content:'';position:absolute;bottom:0;left:0;width:100%;height:4px;background:linear-gradient(90deg,var(--teal),var(--gold));transform:scaleX(0);transform-origin:left;transition:transform .4s ease;}
.servicio-card:hover{transform:translateY(-5px);box-shadow:0 24px 56px rgba(27,42,74,.1);}
.servicio-card:hover::after{transform:scaleX(1);}
.servicio-num{font-family:var(--font-head);font-size:64px;font-weight:800;color:rgba(27,42,74,.06);line-height:1;margin-bottom:16px;letter-spacing:-.02em;}
.servicio-card h3{font-family:var(--font-head);font-size:18px;font-weight:700;color:var(--navy);margin-bottom:12px;line-height:1.2;text-transform:uppercase;letter-spacing:.02em;}
.servicio-card p{font-size:14px;line-height:1.8;color:var(--text-muted);font-weight:300;}
.servicio-tag{display:inline-flex;align-items:center;gap:6px;margin-top:20px;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--teal);font-weight:600;font-family:var(--font-body);}
.servicio-tag::before{content:'';width:16px;height:1.5px;background:var(--teal);}
.chips{display:flex;flex-wrap:wrap;gap:5px;margin-top:14px;padding-top:14px;border-top:1px solid var(--border);}
.chip{font-size:10px;padding:3px 9px;background:var(--off-white);color:var(--text-muted);border-radius:2px;font-family:var(--font-body);letter-spacing:.04em;}

/* ── PROYECTOS ── */
#proyectos{background:var(--off-white);}
.proyectos-header{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:48px;flex-wrap:wrap;gap:20px;}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.gallery-card{position:relative;overflow:hidden;border-radius:4px;background:var(--navy);aspect-ratio:4/3;cursor:pointer;}
.gallery-card.tall{grid-row:span 2;aspect-ratio:auto;}
.gallery-ph{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(135deg,#1B2A4A,#273D6A);transition:transform .5s;min-height:220px;}
.gallery-card:hover .gallery-ph{transform:scale(1.05);}
.gallery-overlay{position:absolute;inset:0;background:rgba(27,42,74,.8);display:flex;flex-direction:column;justify-content:flex-end;padding:24px;opacity:0;transition:opacity .3s;}
.gallery-card:hover .gallery-overlay{opacity:1;}
.gallery-overlay h4{font-family:var(--font-head);font-size:20px;font-weight:700;color:#fff;margin-bottom:4px;text-transform:uppercase;letter-spacing:.02em;}
.gallery-overlay p{font-size:11px;color:rgba(255,255,255,.5);letter-spacing:.1em;text-transform:uppercase;font-family:var(--font-body);}
.geo-icons{display:flex;gap:4px;margin-bottom:14px;}
.tri{width:0;height:0;}
.tri.teal{border-left:16px solid transparent;border-right:16px solid transparent;border-bottom:28px solid rgba(59,191,160,.5);}
.tri.gold{border-left:11px solid transparent;border-right:11px solid transparent;border-bottom:19px solid rgba(245,166,35,.6);align-self:flex-end;}
.ph-label{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.25);margin-top:10px;font-family:var(--font-body);}
.upload-note{margin-top:40px;display:flex;align-items:center;gap:14px;padding:22px 28px;background:#fff;border-left:4px solid var(--teal);border-radius:0 4px 4px 0;}
.upload-note p{font-size:14px;color:var(--text-muted);font-weight:300;}

/* ── NOSOTROS ── */
#nosotros{background:var(--navy);display:grid;grid-template-columns:1fr 1fr;gap:80px;align-items:center;}
#nosotros .section-title{color:#fff;}
#nosotros .section-desc{color:rgba(255,255,255,.5);}
.valores-list{margin-top:44px;display:flex;flex-direction:column;gap:12px;}
.valor-item{display:flex;gap:18px;align-items:flex-start;padding:20px 22px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:4px;transition:background .2s,border-color .2s;}
.valor-item:hover{background:rgba(59,191,160,.08);border-color:rgba(59,191,160,.2);}
.valor-icon{width:36px;height:36px;background:rgba(59,191,160,.15);border-radius:3px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.valor-item h4{font-family:var(--font-head);font-weight:700;font-size:14px;color:#fff;margin-bottom:3px;text-transform:uppercase;letter-spacing:.04em;}
.valor-item p{font-size:13px;color:rgba(255,255,255,.4);line-height:1.65;font-weight:300;}
.nosotros-svg{display:flex;align-items:center;justify-content:center;}

/* ── CTA BAND ── */
.cta-band{background:var(--teal);padding:64px 60px;display:flex;align-items:center;justify-content:space-between;gap:28px;flex-wrap:wrap;}
.cta-band h2{font-family:var(--font-head);font-size:clamp(28px,3.5vw,44px);font-weight:800;color:#fff;line-height:1.1;text-transform:uppercase;letter-spacing:-.01em;}
.btn-white{background:#fff;color:var(--teal-dark);padding:16px 34px;border-radius:3px;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;text-decoration:none;transition:background .2s,transform .15s;white-space:nowrap;font-family:var(--font-body);}
.btn-white:hover{background:var(--off-white);transform:translateY(-2px);}

/* ── CONTACTO ── */
#contacto{background:#fff;}
.contacto-grid{display:grid;grid-template-columns:1fr 1fr;gap:80px;margin-top:60px;align-items:start;}
.redes-grid{display:flex;flex-direction:column;gap:8px;}
.red-social{display:flex;align-items:center;gap:14px;padding:15px 18px;border:1px solid var(--border);border-radius:4px;text-decoration:none;color:var(--navy);transition:border-color .2s,transform .2s,background .2s;}
.red-social:hover{border-color:var(--teal);transform:translateX(5px);background:rgba(59,191,160,.03);}
.red-icon{width:38px;height:38px;border-radius:3px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.red-info{flex:1;}
.red-info strong{display:block;font-size:13px;font-weight:600;font-family:var(--font-body);color:var(--navy);}
.red-info small{font-size:11px;color:var(--text-muted);}
.red-arr{color:var(--text-muted);font-size:15px;transition:color .2s;}
.red-social:hover .red-arr{color:var(--teal);}
.sec-label-sm{font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--text-muted);font-weight:600;margin-bottom:14px;display:block;font-family:var(--font-body);}
.contacto-form{display:flex;flex-direction:column;gap:13px;}
.form-group{display:flex;flex-direction:column;gap:5px;}
.form-group label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);font-weight:600;font-family:var(--font-body);}
.form-group input,.form-group textarea,.form-group select{padding:13px 14px;border:1.5px solid var(--border);border-radius:3px;font-family:var(--font-body);font-size:14px;color:var(--navy);background:var(--off-white);transition:border-color .2s;outline:none;font-weight:300;}
.form-group input:focus,.form-group textarea:focus,.form-group select:focus{border-color:var(--teal);background:#fff;}
.form-group textarea{resize:vertical;min-height:110px;}
.form-submit{background:var(--navy);color:#fff;border:none;padding:15px 28px;font-family:var(--font-body);font-size:12px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;border-radius:3px;transition:background .2s,transform .15s;font-weight:600;align-self:flex-start;}
.form-submit:hover{background:var(--teal-dark);transform:translateY(-1px);}

/* ── FOOTER ── */
footer{background:#0D1827;padding:48px 60px 32px;display:flex;flex-direction:column;gap:28px;}
.footer-top{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:20px;}
.footer-links{display:flex;gap:24px;}
.footer-links a{font-size:11px;color:rgba(255,255,255,.35);text-decoration:none;text-transform:uppercase;letter-spacing:.12em;transition:color .2s;font-family:var(--font-body);font-weight:500;}
.footer-links a:hover{color:var(--gold);}
.footer-copy{font-size:11px;color:rgba(255,255,255,.18);border-top:1px solid rgba(255,255,255,.06);padding-top:22px;text-align:center;letter-spacing:.05em;font-family:var(--font-body);}

/* ── ANIMATIONS ── */
@keyframes fadeUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(-18px);}}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .65s ease,transform .65s ease;}
.reveal.visible{opacity:1;transform:translateY(0);}

/* ── TOAST ── */
.toast{position:fixed;bottom:28px;right:28px;background:var(--teal);color:#fff;padding:13px 22px;border-radius:4px;font-size:13px;font-family:var(--font-body);transform:translateY(70px);opacity:0;transition:all .3s;z-index:9999;pointer-events:none;font-weight:500;}
.toast.show{transform:translateY(0);opacity:1;}

/* ══════════ MODAL AGENDAMIENTO ══════════ */
.modal-backdrop{display:none;position:fixed;inset:0;z-index:8000;background:rgba(10,18,30,.85);backdrop-filter:blur(8px);align-items:center;justify-content:center;padding:20px;}
.modal-backdrop.open{display:flex;}
.modal{background:#fff;border-radius:10px;width:100%;max-width:580px;max-height:90vh;overflow-y:auto;position:relative;animation:modalIn .35s cubic-bezier(.16,1,.3,1) forwards;}
@keyframes modalIn{from{opacity:0;transform:translateY(24px) scale(.97);}to{opacity:1;transform:translateY(0) scale(1);}}
.modal-header{background:var(--navy);padding:28px 32px 24px;border-radius:10px 10px 0 0;position:relative;}
.modal-header-eyebrow{display:flex;align-items:center;gap:10px;margin-bottom:10px;}
.modal-header-eyebrow::before{content:'';width:24px;height:1.5px;background:var(--teal);}
.modal-header-eyebrow span{font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:var(--teal);font-family:var(--font-body);font-weight:600;}
.modal-header h2{font-family:var(--font-head);font-size:26px;font-weight:800;color:#fff;text-transform:uppercase;letter-spacing:.02em;line-height:1.1;}
.modal-header p{font-size:13px;color:rgba(255,255,255,.45);margin-top:6px;font-weight:300;}
.modal-close{position:absolute;top:20px;right:20px;background:rgba(255,255,255,.1);border:none;color:rgba(255,255,255,.7);width:32px;height:32px;border-radius:50%;cursor:pointer;font-size:16px;display:flex;align-items:center;justify-content:center;transition:background .2s;}
.modal-close:hover{background:rgba(255,255,255,.2);}
.modal-body{padding:28px 32px 32px;display:flex;flex-direction:column;gap:16px;}
.modal-row{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
.mf{display:flex;flex-direction:column;gap:5px;}
.mf label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted);font-weight:600;font-family:var(--font-body);}
.mf input,.mf select,.mf textarea{padding:12px 14px;border:1.5px solid var(--border);border-radius:4px;font-family:var(--font-body);font-size:14px;color:var(--navy);background:var(--off-white);outline:none;transition:border-color .2s;font-weight:300;}
.mf input:focus,.mf select:focus,.mf textarea:focus{border-color:var(--teal);background:#fff;}
.mf textarea{resize:none;height:80px;}

/* Calendar picker custom */
.cal-grid-wrap{border:1.5px solid var(--border);border-radius:4px;overflow:hidden;background:#fff;}
.cal-nav{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:var(--off-white);border-bottom:1px solid var(--border);}
.cal-nav span{font-family:var(--font-head);font-size:14px;font-weight:700;color:var(--navy);text-transform:uppercase;letter-spacing:.06em;}
.cal-nav button{background:none;border:1px solid var(--border);color:var(--navy);width:28px;height:28px;border-radius:3px;cursor:pointer;font-size:14px;display:flex;align-items:center;justify-content:center;transition:background .15s;}
.cal-nav button:hover{background:var(--teal);color:#fff;border-color:var(--teal);}
.cal-days-header{display:grid;grid-template-columns:repeat(7,1fr);background:var(--off-white);border-bottom:1px solid var(--border);}
.cal-days-header span{text-align:center;font-size:10px;font-weight:600;color:var(--text-muted);padding:6px 0;letter-spacing:.08em;text-transform:uppercase;font-family:var(--font-body);}
.cal-days{display:grid;grid-template-columns:repeat(7,1fr);padding:8px;}
.cal-day{aspect-ratio:1;display:flex;align-items:center;justify-content:center;font-size:13px;color:var(--navy);cursor:pointer;border-radius:4px;transition:background .15s,color .15s;font-family:var(--font-body);font-weight:400;margin:1px;}
.cal-day:hover:not(.empty):not(.past){background:rgba(59,191,160,.12);color:var(--teal-dark);}
.cal-day.selected{background:var(--teal);color:#fff;font-weight:600;}
.cal-day.today{border:1.5px solid var(--gold);}
.cal-day.past{color:rgba(0,0,0,.2);cursor:default;}
.cal-day.empty{cursor:default;}

/* Time slots */
.time-slots{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;}
.time-slot{padding:8px 4px;border:1.5px solid var(--border);border-radius:4px;text-align:center;font-size:12px;color:var(--text-muted);cursor:pointer;transition:all .15s;font-family:var(--font-body);font-weight:500;background:#fff;}
.time-slot:hover{border-color:var(--teal);color:var(--teal-dark);}
.time-slot.selected{background:var(--navy);color:#fff;border-color:var(--navy);}
.time-slot.unavail{background:var(--off-white);color:rgba(0,0,0,.2);cursor:default;border-color:transparent;}

.modal-selected-date{background:rgba(59,191,160,.08);border:1px solid rgba(59,191,160,.2);border-radius:4px;padding:10px 14px;font-size:13px;color:var(--teal-dark);font-weight:500;display:none;font-family:var(--font-body);}
.modal-selected-date.show{display:block;}
.modal-submit{background:var(--navy);color:#fff;border:none;padding:15px;border-radius:4px;font-family:var(--font-body);font-size:12px;font-weight:700;cursor:pointer;transition:background .2s,transform .15s;letter-spacing:.1em;text-transform:uppercase;width:100%;margin-top:4px;}
.modal-submit:hover{background:var(--teal-dark);transform:translateY(-1px);}
.modal-divider{height:1px;background:var(--border);margin:4px 0;}

/* Floating agendar button */
.float-agendar{position:fixed;bottom:28px;right:28px;z-index:500;background:var(--gold);color:var(--navy);border:none;padding:14px 24px;border-radius:50px;font-family:var(--font-body);font-size:13px;font-weight:700;cursor:pointer;letter-spacing:.08em;text-transform:uppercase;box-shadow:0 8px 32px rgba(245,166,35,.4);transition:transform .2s,box-shadow .2s;display:flex;align-items:center;gap:8px;}
.float-agendar:hover{transform:translateY(-3px);box-shadow:0 12px 40px rgba(245,166,35,.5);}
.float-agendar svg{flex-shrink:0;}

/* ── LANG SWITCHER ── */
.lang-switcher{display:flex;align-items:center;gap:4px;margin-left:20px;}
.lang-btn{background:none;border:none;color:rgba(255,255,255,.5);font-family:var(--font-head);font-size:12px;font-weight:700;letter-spacing:.1em;cursor:pointer;padding:4px 8px;transition:color .2s;}
.lang-btn:hover{color:rgba(255,255,255,.8);}
.lang-btn.active{color:var(--gold);}
.lang-sep{color:rgba(255,255,255,.3);font-size:12px;}

/* ── RESPONSIVE ── */
@media(max-width:900px){
  nav,nav.scrolled{padding:16px 24px;}
  .nav-links{display:none;}
  .hero-content{padding:110px 24px 70px;}.hero-right{display:none;}
  section{padding:72px 24px;}
  .gallery-grid{grid-template-columns:1fr 1fr;}.gallery-card.tall{grid-row:span 1;}
  #nosotros{grid-template-columns:1fr;gap:48px;}.nosotros-svg{display:none;}
  .contacto-grid{grid-template-columns:1fr;gap:48px;}
  .cta-band{padding:48px 24px;}
  footer{padding:40px 24px 24px;}
}
@media(max-width:580px){.gallery-grid{grid-template-columns:1fr;}}

/* ── GALLERY PAGINATOR ── */
.paginator{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:28px;}
.paginator .page-btn{width:36px;height:36px;border:1.5px solid var(--border);border-radius:4px;background:#fff;color:var(--navy);font-family:var(--font-body);font-size:13px;font-weight:600;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,color .15s,border-color .15s;}
.paginator .page-btn:hover{border-color:var(--teal);color:var(--teal-dark);}
.paginator .page-btn.active{background:var(--teal);color:#fff;border-color:var(--teal);}