/**
 * COMPONENTES — PORTAL GOBIERNO DE TAPALPA
 * components.css
 */

/* ---- TOPBAR ---- */
.topbar{background:var(--c-primary-ultra);color:rgba(255,255,255,.7);font-size:var(--text-xs);padding-block:var(--space-2);border-bottom:1px solid rgba(255,255,255,.08);}
.topbar__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);}
.topbar__info{display:flex;align-items:center;gap:var(--space-4);}
.topbar__item{display:flex;align-items:center;gap:var(--space-1);}
.topbar__links{display:flex;align-items:center;gap:var(--space-3);}
.topbar__link{color:rgba(255,255,255,.6);font-size:var(--text-xs);transition:color var(--transition-fast);}
.topbar__link:hover{color:var(--c-gold-light);}
@media(max-width:767px){.topbar{display:none;}}

/* ---- HEADER ---- */
/* ── HEADER: position sticky (se queda pegado al hacer scroll,
      pero en la carga inicial aparece DEBAJO del topbar) ── */
.header{
  position:sticky;
  top: 0;
  left:0;
  right:0;
  z-index:var(--z-header);
  background:rgba(13,43,78,.97);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  border-bottom:1px solid rgba(255,255,255,.08);
  height:var(--header-height);
  transition:background var(--transition-base), box-shadow var(--transition-base), height var(--transition-base);
}
.header.is-scrolled{
  height:var(--header-height-scrolled);
  background:rgba(10,31,56,.99);
  box-shadow:var(--shadow-lg);
}
.header__inner{display:flex;align-items:center;justify-content:space-between;height:100%;gap:var(--space-6);  padding-top:0px;}
.header__logo{display:flex;align-items:center;gap:var(--space-3);flex-shrink:0;text-decoration:none;}
.header__logo-img{height:70px;width:auto;transition:height var(--transition-base);}
.header.is-scrolled .header__logo-img{height:55px;}
.header__logo-text{display:flex;flex-direction:column;}
.header__logo-title{font-family:var(--font-display);font-size:var(--text-md);font-weight:var(--fw-bold);color:var(--c-white);line-height:1.1;}
.header__logo-subtitle{font-size:var(--text-xs);color:var(--c-gold-light);font-weight:var(--fw-medium);letter-spacing:.04em;}
.header__actions{display:flex;align-items:center;gap:var(--space-3);flex-shrink:0;}

/* ---- NAV ---- */
.nav{display:flex;align-items:center;gap:var(--space-1);}
.nav__item{position:relative;}
.nav__link{display:flex;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);color:rgba(255,255,255,.85);font-size:var(--text-sm);font-weight:var(--fw-medium);border-radius:var(--radius-md);transition:all var(--transition-fast);white-space:nowrap;text-decoration:none;}
.nav__link:hover,.nav__link.is-active{color:var(--c-white);background:rgba(255,255,255,.1);}
.nav__link .arrow{width:12px;height:12px;transition:transform var(--transition-fast);opacity:.7;}
.nav__item:hover .arrow,.nav__item.is-open .arrow{transform:rotate(180deg);}
.nav__dropdown{
  position:absolute;
  /* top: 100% sin gap — el gap lo cubre el ::after del nav__item */
  top:100%;
  left:50%;
  transform:translateX(-50%) translateY(-6px);
  min-width:220px;
  background:var(--c-white);
  border:1px solid var(--c-border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-xl);
  padding:var(--space-2);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity var(--transition-base),transform var(--transition-base),visibility var(--transition-base);
  z-index:var(--z-dropdown);
}
.nav__dropdown::before{
  content:'';
  position:absolute;
  top:-5px;left:50%;
  transform:translateX(-50%) rotate(45deg);
  width:10px;height:10px;
  background:var(--c-white);
  border-left:1px solid var(--c-border);
  border-top:1px solid var(--c-border);
}
/* Puente invisible sobre el gap: extiende la zona hover del item hacia abajo */
.nav__item::after{
  content:'';
  position:absolute;
  bottom:-8px;left:0;right:0;
  height:8px;
  display:block;
}
/* Mostrar dropdown: activado por JS (clase is-open) en desktop Y mobile */
.nav__item.is-open .nav__dropdown{
  opacity:1;
  visibility:visible;
  pointer-events:all;
  transform:translateX(-50%) translateY(0);
}
.nav__dropdown-link{display:block;padding:var(--space-2) var(--space-4);color:var(--c-text);font-size:var(--text-sm);border-radius:var(--radius-md);transition:all var(--transition-fast);text-decoration:none;}
.nav__dropdown-link:hover{background:var(--c-surface);color:var(--c-primary);padding-left:var(--space-5);}

/* Search toggle */
.search-toggle{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:var(--radius-md);color:rgba(255,255,255,.8);background:rgba(255,255,255,.08);transition:all var(--transition-fast);cursor:pointer;border:none;}
.search-toggle:hover{background:rgba(255,255,255,.15);color:var(--c-white);}

/* Menu toggle hamburguesa */
.menu-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;border-radius:var(--radius-md);background:rgba(255,255,255,.08);transition:background var(--transition-fast);border:none;cursor:pointer;}
.menu-toggle:hover{background:rgba(255,255,255,.15);}
.menu-toggle__bar{display:block;width:22px;height:2px;background:var(--c-white);border-radius:2px;transition:all var(--transition-base);transform-origin:center;}
.menu-toggle.is-active .menu-toggle__bar:nth-child(1){transform:translateY(7px) rotate(45deg);}
.menu-toggle.is-active .menu-toggle__bar:nth-child(2){opacity:0;transform:scaleX(0);}
.menu-toggle.is-active .menu-toggle__bar:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

@media(max-width:1023px){
  .menu-toggle{display:flex;}
  .header__logo-text{display:none;}
  .nav{
    position:fixed;
    /* Calculamos el top como la altura del topbar (36px en desktop, 0 en mobile) + el header */
    top:var(--header-height);
    left:0;right:0;
    background:var(--c-primary-ultra);
    border-top:1px solid rgba(255,255,255,.1);
    padding:var(--space-4);
    flex-direction:column;
    align-items:stretch;
    gap:var(--space-1);
    max-height:calc(100vh - var(--header-height));
    overflow-y:auto;
    transform:translateY(-110%);
    opacity:0;
    visibility:hidden;
    transition:all var(--transition-base);
    z-index:var(--z-sticky);
  }
  .nav.is-open{transform:translateY(0);opacity:1;visibility:visible;}
  .nav__link{padding:var(--space-3) var(--space-4);font-size:var(--text-base);}
  .nav__dropdown{
    position:static;
    transform:none !important;
    opacity:1;
    visibility:visible;
    pointer-events:all;
    box-shadow:none;
    border:none;
    background:rgba(255,255,255,.05);
    border-radius:var(--radius-md);
    /* Oculto por defecto en móvil con display */
    display:none;
    margin-top:var(--space-1);
    padding:var(--space-1);
  }
  .nav__item.is-open .nav__dropdown{display:block;}
  .nav__dropdown-link{color:rgba(255,255,255,.75);}
  .nav__dropdown-link:hover{background:rgba(255,255,255,.1);color:var(--c-white);}
}

/* Search bar */
.search-bar{
  position:sticky;
  top:var(--header-height);
  left:0;right:0;
  background:var(--c-primary-ultra);
  border-bottom:2px solid var(--c-gold);
  padding:var(--space-4);
  /* Oculto fuera del flujo visual con transform+opacity */
  max-height:0;
  overflow:hidden;
  padding:0;
  opacity:0;
  transition:max-height var(--transition-base), opacity var(--transition-base), padding var(--transition-base);
  z-index:var(--z-sticky);
}
.search-bar.is-open{
  max-height:200px;
  opacity:1;
  padding:var(--space-4);
}
.search-bar__form{display:flex;align-items:center;gap:var(--space-3);max-width:600px;margin-inline:auto;}
.search-bar__input{flex:1;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);border-radius:var(--radius-md);padding:var(--space-3) var(--space-4);color:var(--c-white);font-size:var(--text-base);outline:none;transition:border-color var(--transition-fast);}
.search-bar__input::placeholder{color:rgba(255,255,255,.4);}
.search-bar__input:focus{border-color:var(--c-gold);}
.search-results-preview{margin-top:var(--space-2);max-width:600px;margin-inline:auto;}
.search-result-item{padding:var(--space-2) var(--space-4);background:rgba(255,255,255,.05);border-radius:var(--radius-md);color:rgba(255,255,255,.8);font-size:var(--text-sm);cursor:pointer;transition:background var(--transition-fast);}
.search-result-item:hover{background:rgba(255,255,255,.12);}
.search-result-item mark{background:transparent;color:var(--c-gold-light);font-weight:var(--fw-semibold);}

/* ---- HERO / CARRUSEL ---- */
.hero{position:relative;height:clamp(480px,75vh,720px);overflow:hidden;background:var(--c-primary-ultra);}
.carousel{position:relative;width:100%;height:100%;}
.carousel__track{display:flex;height:100%;transition:transform 700ms cubic-bezier(.77,0,.175,1);}
.carousel__slide{position:relative;flex-shrink:0;width:100%;height:100%;overflow:hidden;}
.carousel__image{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform 8000ms ease;transform:scale(1.05);}
.carousel__slide.is-active .carousel__image{transform:scale(1);}
.carousel__overlay{position:absolute;inset:0;background:linear-gradient(135deg,rgba(13,43,78,.88) 0%,rgba(13,43,78,.52) 55%,rgba(13,43,78,.25) 100%);}
.carousel__content{position:absolute;inset:0;display:flex;align-items:center;}
.carousel__text{max-width:640px;padding-inline:var(--space-4);opacity:0;transform:translateY(24px);transition:all 600ms cubic-bezier(.4,0,.2,1) 200ms;}
.carousel__slide.is-active .carousel__text{opacity:1;transform:translateY(0);}
.carousel__eyebrow{display:inline-block;background:var(--c-gold);color:var(--c-primary);font-size:var(--text-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.1em;padding:var(--space-1) var(--space-3);border-radius:var(--radius-full);margin-bottom:var(--space-4);}
.carousel__title{font-size:clamp(var(--text-xl),4.5vw,var(--text-3xl));color:var(--c-white);line-height:var(--lh-snug);margin-bottom:var(--space-4);text-shadow:0 2px 8px rgba(0,0,0,.3);}
.carousel__description{font-size:var(--text-md);color:rgba(255,255,255,.85);line-height:var(--lh-relaxed);margin-bottom:var(--space-8);max-width:50ch;text-shadow:0 1px 4px rgba(0,0,0,.3);}
.carousel__cta{display:flex;flex-wrap:wrap;gap:var(--space-3);}
.carousel__controls{position:absolute;bottom:var(--space-8);left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:var(--space-6);z-index:10;}
.carousel__dots{display:flex;gap:var(--space-2);}
.carousel__dot{width:8px;height:8px;border-radius:var(--radius-full);background:rgba(255,255,255,.4);border:1px solid rgba(255,255,255,.3);transition:all var(--transition-base);cursor:pointer;padding:0;}
.carousel__dot.is-active{background:var(--c-gold);border-color:var(--c-gold);width:24px;}
.carousel__btn{width:44px;height:44px;border-radius:var(--radius-full);background:rgba(255,255,255,.15);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.2);color:var(--c-white);display:flex;align-items:center;justify-content:center;transition:all var(--transition-fast);cursor:pointer;font-size:18px;}
.carousel__btn:hover{background:rgba(255,255,255,.28);transform:scale(1.05);}
.carousel__progress{position:absolute;bottom:0;left:0;height:3px;background:var(--c-gold);transform-origin:left;z-index:10;transition:transform 100ms linear;}

/* ---- BUTTONS ---- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--fw-semibold);font-family:var(--font-body);text-decoration:none;border:2px solid transparent;cursor:pointer;transition:all var(--transition-base);white-space:nowrap;line-height:1;}
.btn:focus-visible{outline:3px solid var(--c-gold);outline-offset:3px;}
.btn--primary{background:var(--c-gold);color:var(--c-primary);border-color:var(--c-gold);}
.btn--primary:hover{background:var(--c-gold-dark);border-color:var(--c-gold-dark);color:var(--c-white);transform:translateY(-1px);box-shadow:var(--shadow-gold);}
.btn--secondary{background:transparent;color:var(--c-white);border-color:rgba(255,255,255,.5);}
.btn--secondary:hover{background:rgba(255,255,255,.12);border-color:var(--c-white);color:var(--c-white);}
.btn--outline{background:transparent;color:var(--c-primary);border-color:var(--c-primary);}
.btn--outline:hover{background:var(--c-primary);color:var(--c-white);transform:translateY(-1px);}
.btn--ghost{background:transparent;color:var(--c-primary);border-color:transparent;}
.btn--ghost:hover{background:var(--c-surface-2);color:var(--c-primary);}
.btn--sm{padding:var(--space-2) var(--space-4);font-size:var(--text-xs);}
.btn--lg{padding:var(--space-4) var(--space-8);font-size:var(--text-base);}
.btn--full{width:100%;}

/* ---- CARDS ---- */
.card{background:var(--c-white);border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden;transition:all var(--transition-base);}
.card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px);border-color:var(--c-border-strong);}
.card__image{width:100%;aspect-ratio:16/9;object-fit:cover;}
.card__body{padding:var(--space-5) var(--space-6);}
.card__footer{padding:var(--space-4) var(--space-6);border-top:1px solid var(--c-border);background:var(--c-surface);}
.card__category{font-size:var(--text-xs);font-weight:var(--fw-bold);text-transform:uppercase;letter-spacing:.1em;color:var(--c-gold);margin-bottom:var(--space-2);}
.card__title{font-size:var(--text-md);color:var(--c-primary);margin-bottom:var(--space-3);line-height:var(--lh-snug);transition:color var(--transition-fast);}
.card:hover .card__title{color:var(--c-primary-light);}
.card__excerpt{font-size:var(--text-sm);color:var(--c-text-secondary);line-height:var(--lh-relaxed);}
.card__meta{display:flex;align-items:center;gap:var(--space-3);font-size:var(--text-xs);color:var(--c-text-muted);}

/* Service Card */
.service-card{display:flex;align-items:flex-start;gap:var(--space-4);padding:var(--space-5);background:var(--c-white);border:1px solid var(--c-border);border-radius:var(--radius-lg);text-decoration:none;transition:all var(--transition-base);}
.service-card:hover{box-shadow:var(--shadow-md);border-color:var(--c-primary);transform:translateY(-1px);}
.service-card__icon{flex-shrink:0;width:48px;height:48px;border-radius:var(--radius-md);background:var(--c-surface);display:flex;align-items:center;justify-content:center;color:var(--c-primary);font-size:22px;transition:all var(--transition-base);}
.service-card:hover .service-card__icon{background:var(--c-primary);color:var(--c-white);}
.service-card__body{flex:1;min-width:0;}
.service-card__title{font-size:var(--text-base);font-weight:var(--fw-semibold);color:var(--c-primary);margin-bottom:var(--space-1);font-family:var(--font-body);line-height:var(--lh-snug);}
.service-card__desc{font-size:var(--text-sm);color:var(--c-text-secondary);line-height:var(--lh-normal);}
.service-card__arrow{color:var(--c-text-muted);flex-shrink:0;transition:all var(--transition-base);font-size:18px;}
.service-card:hover .service-card__arrow{color:var(--c-primary);transform:translateX(3px);}

/* Doc Card */
.doc-card{display:flex;align-items:center;gap:var(--space-4);padding:var(--space-4) var(--space-5);background:var(--c-white);border:1px solid var(--c-border);border-radius:var(--radius-lg);text-decoration:none;transition:all var(--transition-base);}
.doc-card:hover{border-color:var(--c-primary);background:var(--c-surface);transform:translateX(3px);}
.doc-card__icon{flex-shrink:0;width:44px;height:44px;background:var(--c-surface-2);border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;font-size:20px;color:var(--c-primary);transition:all var(--transition-base);}
.doc-card:hover .doc-card__icon{background:var(--c-primary);color:var(--c-white);}
.doc-card__info{flex:1;min-width:0;}
.doc-card__title{font-size:var(--text-sm);font-weight:var(--fw-semibold);color:var(--c-primary);margin-bottom:var(--space-1);font-family:var(--font-body);}
.doc-card__meta{font-size:var(--text-xs);color:var(--c-text-muted);}
.doc-card__badge{flex-shrink:0;font-size:var(--text-xs);font-weight:var(--fw-bold);color:var(--c-green);background:rgba(26,107,68,.1);padding:var(--space-1) var(--space-2);border-radius:var(--radius-full);}

/* Stat Card */
.stat-card{padding:var(--space-6);background:var(--c-white);border:1px solid var(--c-border);border-radius:var(--radius-lg);text-align:center;position:relative;overflow:hidden;}
.stat-card::before{content:'';position:absolute;top:0;left:0;right:0;height:3px;background:var(--gradient-gold);}
.stat-card__number{font-family:var(--font-display);font-size:var(--text-3xl);font-weight:var(--fw-bold);color:var(--c-primary);line-height:1;margin-bottom:var(--space-2);}
.stat-card__label{font-size:var(--text-sm);color:var(--c-text-secondary);font-weight:var(--fw-medium);}

/* Transparency link */
.transparency-link{display:flex;flex-direction:column;align-items:center;text-align:center;gap:var(--space-3);padding:var(--space-5) var(--space-4);background:var(--c-white);border:1px solid var(--c-border);border-radius:var(--radius-lg);text-decoration:none;transition:all var(--transition-base);color:var(--c-primary);}
.transparency-link:hover{background:var(--c-primary);border-color:var(--c-primary);color:var(--c-white);transform:translateY(-2px);box-shadow:var(--shadow-md);}
.transparency-link__icon{font-size:28px;line-height:1;}
.transparency-link__label{font-size:var(--text-sm);font-weight:var(--fw-semibold);line-height:var(--lh-snug);}

/* Quick access tags */
.quick-access{display:flex;flex-wrap:wrap;gap:var(--space-2);align-items:center;}
.quick-access__label{font-size:var(--text-sm);font-weight:var(--fw-semibold);color:var(--c-text-secondary);white-space:nowrap;}
.quick-access__tag{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-2) var(--space-3);background:var(--c-surface);border:1px solid var(--c-border);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--fw-medium);color:var(--c-text-secondary);text-decoration:none;transition:all var(--transition-fast);}
.quick-access__tag:hover{background:var(--c-primary);border-color:var(--c-primary);color:var(--c-white);}

/* Badge */
.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:var(--space-1) var(--space-2);border-radius:var(--radius-full);font-size:var(--text-xs);font-weight:var(--fw-semibold);line-height:1;}
.badge--primary{background:rgba(13,43,78,.1);color:var(--c-primary);}
.badge--gold{background:rgba(200,150,12,.15);color:var(--c-gold-dark);}
.badge--green{background:rgba(26,107,68,.12);color:var(--c-green);}
.badge--new{background:var(--c-gold);color:var(--c-primary);}

/* Presidente */
.president-section{display:grid;grid-template-columns:1fr 1.5fr;gap:var(--space-12);align-items:center;}
@media(max-width:767px){.president-section{grid-template-columns:1fr;}}
.president-photo-wrap{position:relative;}
.president-photo{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);display:block;background:var(--c-surface-2);}
.president-photo-bg{width:100%;aspect-ratio:3/4;border-radius:var(--radius-xl);background:linear-gradient(145deg,var(--c-primary) 0%,var(--c-primary-light) 100%);display:flex;align-items:center;justify-content:center;font-size:80px;color:rgba(255,255,255,.3);}
.president-photo-badge{position:absolute;bottom:var(--space-4);left:var(--space-4);right:var(--space-4);background:var(--c-primary);color:var(--c-white);padding:var(--space-3) var(--space-4);border-radius:var(--radius-lg);text-align:center;}
.president-photo-badge__name{font-family:var(--font-display);font-size:var(--text-base);font-weight:var(--fw-bold);color:var(--c-white);}
.president-photo-badge__role{font-size:var(--text-xs);color:var(--c-gold-light);}
.president-quote{font-family:var(--font-display);font-size:var(--text-lg);color:var(--c-text);line-height:var(--lh-relaxed);font-style:italic;position:relative;padding-left:var(--space-6);margin-bottom:var(--space-6);}
.president-quote::before{content:'"';position:absolute;left:0;top:-8px;font-size:64px;color:var(--c-gold);font-family:var(--font-display);line-height:1;}

/* Accordion */
.accordion{border:1px solid var(--c-border);border-radius:var(--radius-lg);overflow:hidden;}
.accordion__item{border-bottom:1px solid var(--c-border);}
.accordion__item:last-child{border-bottom:none;}
.accordion__trigger{display:flex;align-items:center;justify-content:space-between;width:100%;padding:var(--space-4) var(--space-6);background:var(--c-white);text-align:left;font-size:var(--text-base);font-weight:var(--fw-semibold);color:var(--c-primary);font-family:var(--font-body);gap:var(--space-4);transition:background var(--transition-fast);border:none;cursor:pointer;}
.accordion__trigger:hover{background:var(--c-surface);}
.accordion__trigger[aria-expanded="true"]{background:var(--c-surface-2);}
.accordion__icon{flex-shrink:0;font-size:20px;color:var(--c-gold);transition:transform var(--transition-base);}
.accordion__trigger[aria-expanded="true"] .accordion__icon{transform:rotate(45deg);}
.accordion__panel{max-height:0;overflow:hidden;transition:max-height var(--transition-slow);}
.accordion__panel.is-open{max-height:500px;}
.accordion__content{padding:0 var(--space-6) var(--space-5);font-size:var(--text-sm);color:var(--c-text-secondary);line-height:var(--lh-relaxed);}

/* Tabs */
.tabs__list{display:flex;gap:0;border-bottom:2px solid var(--c-border);overflow-x:auto;scrollbar-width:none;}
.tabs__list::-webkit-scrollbar{display:none;}
.tabs__btn{flex-shrink:0;padding:var(--space-3) var(--space-5);font-size:var(--text-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary);border-bottom:2px solid transparent;margin-bottom:-2px;transition:all var(--transition-fast);font-family:var(--font-body);background:none;border-left:none;border-right:none;border-top:none;cursor:pointer;}
.tabs__btn:hover{color:var(--c-primary);}
.tabs__btn[aria-selected="true"]{color:var(--c-primary);border-bottom-color:var(--c-primary);font-weight:var(--fw-semibold);}
.tabs__panel{display:none;padding-top:var(--space-6);}
.tabs__panel.is-active{display:block;}

/* Forms */
.form-group{margin-bottom:var(--space-5);}
.form-label{display:block;margin-bottom:var(--space-2);font-size:var(--text-sm);font-weight:var(--fw-medium);color:var(--c-text);}
.form-label--required::after{content:' *';color:var(--c-error);}
.form-input,.form-textarea,.form-select{width:100%;padding:var(--space-3) var(--space-4);background:var(--c-white);border:1.5px solid var(--c-border);border-radius:var(--radius-md);font-size:var(--text-base);font-family:var(--font-body);color:var(--c-text);transition:border-color var(--transition-fast),box-shadow var(--transition-fast);outline:none;}
.form-input:focus,.form-textarea:focus,.form-select:focus{border-color:var(--c-primary);box-shadow:0 0 0 3px rgba(13,43,78,.1);}
.form-input::placeholder,.form-textarea::placeholder{color:var(--c-text-muted);}
.form-textarea{min-height:120px;resize:vertical;}
.form-hint{margin-top:var(--space-1);font-size:var(--text-xs);color:var(--c-text-muted);}
.form-error{margin-top:var(--space-1);font-size:var(--text-xs);color:var(--c-error);display:none;}
.form-group.has-error .form-input,.form-group.has-error .form-textarea{border-color:var(--c-error);}
.form-group.has-error .form-error{display:block;}

/* Alert */
.alert{display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-4) var(--space-5);border-radius:var(--radius-md);border:1px solid;font-size:var(--text-sm);}
.alert--info{background:rgba(21,101,168,.06);border-color:rgba(21,101,168,.2);color:var(--c-info);}
.alert--success{background:rgba(30,122,67,.06);border-color:rgba(30,122,67,.2);color:var(--c-success);}
.alert--warning{background:rgba(184,101,10,.06);border-color:rgba(184,101,10,.2);color:var(--c-warning);}

/* FOOTER */
.footer{background:var(--c-primary-ultra);color:rgba(255,255,255,.7);padding-top:var(--space-16);}
.footer__grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--space-8) var(--space-6);padding-bottom:var(--space-12);border-bottom:1px solid rgba(255,255,255,.08);}
@media(max-width:1023px){.footer__grid{grid-template-columns:1fr 1fr;}.footer__brand{grid-column:1 / -1;}}
@media(max-width:639px){.footer__grid{grid-template-columns:1fr;}}
.footer__logo{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-4);text-decoration:none;}
.footer__logo-img{height:150px;width:auto;}
.footer__logo-text{font-family:var(--font-display);font-size:var(--text-md);font-weight:var(--fw-bold);color:var(--c-white);line-height:1.1;}
.footer__tagline{font-size:var(--text-sm);line-height:var(--lh-relaxed);margin-bottom:var(--space-5);max-width:36ch;}
.footer__address{font-size:var(--text-sm);line-height:var(--lh-relaxed);display:flex;flex-direction:column;gap:var(--space-2);}
.footer__address-item{display:flex;align-items:flex-start;gap:var(--space-2);}
.footer__col-title{font-size:var(--text-sm);font-weight:var(--fw-bold);color:var(--c-white);text-transform:uppercase;letter-spacing:.08em;margin-bottom:var(--space-4);}
.footer__links{display:flex;flex-direction:column;gap:var(--space-2);}
.footer__link{font-size:var(--text-sm);color:rgba(255,255,255,.6);text-decoration:none;transition:color var(--transition-fast);display:flex;align-items:center;gap:var(--space-2);}
.footer__link:hover{color:var(--c-gold-light);}
.footer__link::before{content:'›';color:var(--c-gold);font-size:14px;}
.footer__social{display:flex;gap:var(--space-3);margin-top:var(--space-5);}
.footer__social-link{width:36px;height:36px;border-radius:var(--radius-md);background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.7);font-size:16px;transition:all var(--transition-fast);text-decoration:none;}
.footer__social-link:hover{background:var(--c-gold);color:var(--c-primary);}
.footer__bottom{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:var(--space-4);padding-block:var(--space-5);}
.footer__copyright{font-size:var(--text-xs);color:rgba(255,255,255,.4);}
.footer__legal{display:flex;gap:var(--space-4);}
.footer__legal-link{font-size:var(--text-xs);color:rgba(255,255,255,.4);text-decoration:none;transition:color var(--transition-fast);}
.footer__legal-link:hover{color:var(--c-gold-light);}

/* Pagination */
.pagination{display:flex;align-items:center;justify-content:center;gap:var(--space-2);padding-top:var(--space-8);}
.pagination__btn{min-width:40px;height:40px;display:flex;align-items:center;justify-content:center;border-radius:var(--radius-md);font-size:var(--text-sm);font-weight:var(--fw-medium);color:var(--c-text-secondary);border:1px solid var(--c-border);background:var(--c-white);transition:all var(--transition-fast);text-decoration:none;font-family:var(--font-body);cursor:pointer;}
.pagination__btn:hover{border-color:var(--c-primary);color:var(--c-primary);}
.pagination__btn.is-active{background:var(--c-primary);color:var(--c-white);border-color:var(--c-primary);}

/* Scroll to top */
.scroll-top{position:fixed;bottom:var(--space-6);right:var(--space-6);width:44px;height:44px;border-radius:var(--radius-full);background:var(--c-primary);color:var(--c-white);display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(12px);transition:all var(--transition-base);z-index:var(--z-raised);border:2px solid rgba(255,255,255,.15);cursor:pointer;font-size:18px;}
.scroll-top.is-visible{opacity:1;visibility:visible;transform:translateY(0);}
.scroll-top:hover{background:var(--c-gold);color:var(--c-primary);transform:translateY(-2px);}

/* Skeleton */
.skeleton{background:linear-gradient(90deg,var(--c-surface) 25%,var(--c-surface-2) 50%,var(--c-surface) 75%);background-size:200% 100%;animation:skeleton-pulse 1.5s infinite;border-radius:var(--radius-md);}
@keyframes skeleton-pulse{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* Sr only */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border-width:0;}

/* Skip link */
.skip-link{position:absolute;top:-100%;left:var(--space-4);background:var(--c-gold);color:var(--c-primary);font-weight:var(--fw-bold);padding:var(--space-3) var(--space-6);border-radius:0 0 var(--radius-md) var(--radius-md);z-index:var(--z-toast);transition:top var(--transition-fast);}
.skip-link:focus{top:0;outline:none;}

/* Animate on scroll */
.anim-fade-up{opacity:0;transform:translateY(30px);transition:opacity 600ms ease,transform 600ms ease;}
.anim-fade-up.is-visible{opacity:1;transform:translateY(0);}
.anim-delay-1{transition-delay:100ms;}
.anim-delay-2{transition-delay:200ms;}
.anim-delay-3{transition-delay:300ms;}
.anim-delay-4{transition-delay:400ms;}