/* ===================================
   LAYOUT — Navigation, Footer, Base
   =================================== */

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}

html{font-size:16px;scroll-behavior:smooth;-webkit-font-smoothing:antialiased}

body{
  font-family:var(--font-sans);
  font-size:var(--text-base);
  font-weight:var(--font-regular);
  line-height:var(--leading-normal);
  color:var(--color-text-primary);
  background-color:var(--color-bg);
  min-height:100vh;
  overflow-x:hidden;
  transition:background-color var(--transition-slow),color var(--transition-slow);
}

/* Page Transition */
#page-transition{
  position:fixed;inset:0;
  background:var(--color-bg);
  z-index:var(--z-modal);
  pointer-events:none;
  opacity:0;
  transition:opacity 0.3s ease;
}
#page-transition.active{opacity:1;pointer-events:all;}

/* Container */
.container{width:100%;max-width:var(--container-max);margin-inline:auto;padding-inline:var(--space-6);}
.container--narrow{max-width:var(--container-narrow);margin-inline:auto;padding-inline:var(--space-6);}

/* NAV */
.nav{
  position:fixed;top:0;left:0;right:0;
  height:var(--nav-height);
  z-index:var(--z-sticky);
  transition:background-color var(--transition-base),backdrop-filter var(--transition-base),box-shadow var(--transition-base);
}
.nav.scrolled{
  background-color:rgba(255,255,255,0.82);
  backdrop-filter:saturate(180%) blur(20px);
  -webkit-backdrop-filter:saturate(180%) blur(20px);
  box-shadow:0 1px 0 var(--color-border);
}
@media(prefers-color-scheme:dark){.nav.scrolled{background-color:rgba(28,28,30,0.82);}}

.nav__inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);}

.nav__logo{font-size:var(--text-lg);font-weight:var(--font-bold);color:var(--color-text-primary);text-decoration:none;letter-spacing:var(--tracking-tight);flex-shrink:0;transition:color var(--transition-fast);}
.nav__logo:hover{color:var(--color-accent);}
.nav__logo span{color:var(--color-accent);}

.nav__links{display:flex;align-items:center;gap:var(--space-1);list-style:none;}

.nav__link{display:block;padding:var(--space-2) var(--space-3);font-size:var(--text-sm);font-weight:var(--font-medium);color:var(--color-text-secondary);text-decoration:none;border-radius:var(--radius-md);transition:color var(--transition-fast),background-color var(--transition-fast);letter-spacing:var(--tracking-wide);}
.nav__link:hover,.nav__link.active{color:var(--color-text-primary);background-color:var(--color-accent-light);}
.nav__link.active{color:var(--color-accent);}

.nav__actions{display:flex;align-items:center;gap:var(--space-2);flex-shrink:0;}

.lang-btn{padding:var(--space-2) var(--space-4);font-size:var(--text-sm);font-weight:var(--font-semibold);font-family:var(--font-sans);color:var(--color-accent);background:var(--color-accent-light);border:1.5px solid var(--color-accent-medium);border-radius:var(--radius-full);cursor:pointer;transition:background-color var(--transition-fast),transform var(--transition-fast);white-space:nowrap;}
.lang-btn:hover{background-color:var(--color-accent-medium);transform:translateY(-1px);}

.nav__hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:var(--space-2);background:none;border:none;border-radius:var(--radius-sm);}
.nav__hamburger span{display:block;width:22px;height:2px;background:var(--color-text-primary);border-radius:2px;transition:transform var(--transition-base),opacity var(--transition-fast);}
.nav__hamburger.open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.nav__hamburger.open span:nth-child(2){opacity:0;}
.nav__hamburger.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}

.nav__mobile{display:none;position:fixed;top:var(--nav-height);left:0;right:0;background:var(--color-surface);border-bottom:1px solid var(--color-border);padding:var(--space-4) var(--space-6);box-shadow:var(--shadow-lg);z-index:calc(var(--z-sticky) - 1);animation:slideDown 0.2s ease;}
.nav__mobile.open{display:block;}
@keyframes slideDown{from{opacity:0;transform:translateY(-8px);}to{opacity:1;transform:translateY(0);}}
.nav__mobile-links{list-style:none;display:flex;flex-direction:column;gap:var(--space-1);}
.nav__mobile-link{display:block;padding:var(--space-3) var(--space-4);font-size:var(--text-base);font-weight:var(--font-medium);color:var(--color-text-secondary);text-decoration:none;border-radius:var(--radius-md);transition:background-color var(--transition-fast),color var(--transition-fast);}
.nav__mobile-link:hover,.nav__mobile-link.active{background-color:var(--color-accent-light);color:var(--color-accent);}
.nav__mobile-lang{margin-top:var(--space-3);padding-top:var(--space-3);border-top:1px solid var(--color-border);}

.page-content{padding-top:var(--nav-height);}

/* Sections */
.section{padding-block:var(--space-24);}
.section--sm{padding-block:var(--space-16);}
.section--lg{padding-block:var(--space-32);}
.section__header{margin-bottom:var(--space-16);}
.section__header--center{text-align:center;}
.section__eyebrow{display:inline-block;font-size:var(--text-xs);font-weight:var(--font-semibold);letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--color-accent);margin-bottom:var(--space-3);}
.section__title{font-size:var(--text-4xl);font-weight:var(--font-bold);letter-spacing:var(--tracking-tight);line-height:var(--leading-tight);color:var(--color-text-primary);margin-bottom:var(--space-4);}
.section__subtitle{font-size:var(--text-lg);color:var(--color-text-secondary);max-width:56ch;line-height:var(--leading-relaxed);}
.section__header--center .section__subtitle{margin-inline:auto;}

/* Grids */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--space-6);}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--space-6);}
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--space-4);}

/* Footer */
.footer{border-top:1px solid var(--color-border);padding-block:var(--space-8);text-align:center;color:var(--color-text-tertiary);font-size:var(--text-sm);}

/* Reveal */
.reveal{opacity:0;transform:translateY(24px);transition:opacity 0.6s ease,transform 0.6s ease;}
.reveal.visible{opacity:1;transform:translateY(0);}

/* Responsive */
@media(max-width:1024px){.grid-3{grid-template-columns:repeat(2,1fr);}.grid-4{grid-template-columns:repeat(2,1fr);}}
@media(max-width:768px){
  :root{--nav-height:56px;}
  .nav__links{display:none;}
  .nav__hamburger{display:flex;}
  .section{padding-block:var(--space-16);}
  .section--lg{padding-block:var(--space-20);}
  .section__title{font-size:var(--text-3xl);}
  .section__subtitle{font-size:var(--text-base);}
  .grid-2{grid-template-columns:1fr;}
  .grid-3{grid-template-columns:1fr;}
  .grid-4{grid-template-columns:repeat(2,1fr);}
  .container{padding-inline:var(--space-4);}
}
@media(max-width:480px){.grid-4{grid-template-columns:1fr;}.section__title{font-size:var(--text-2xl);}}
