/* ===== RESET & BASE ===== */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html {
  scroll-behavior: smooth;
  scroll-padding-top: calc(var(--nav-h) + env(safe-area-inset-top, 0px) - 35px);
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}
body{
  font-family:'Inter',system-ui,-apple-system,sans-serif;
  background:#1a1f2e;
  color:antiquewhite;
  line-height:1.6;
  min-height:100dvh;
  -webkit-tap-highlight-color:transparent;
  min-height:-webkit-fill-available;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
ul{list-style:none}
button,input,textarea{font:inherit;border:none;outline:none}
button{cursor:pointer}
input:focus-visible,textarea:focus-visible,button:focus-visible,a:focus-visible{
  outline:2px solid #FFC107;
  outline-offset:2px;
}

/* ===== VARIABLES ===== */
:root{
  --navy:#1a1f2e;
  --navy-light:#232940;
  --navy-card:#1e2538;
  --yellow:#FFC107;
  --yellow-hover:#e6ad00;
  --white:#ffffff;
  --gray:#b0b8c9;
  --max-w:1200px;
  --radius:20px;
  --nav-h:clamp(60px,8vw,76px);
}

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

/* ===== CONTAINER ===== */
.container{
  width:min(var(--max-w),100% - 2rem);
  margin-inline:auto;
  padding-left: env(safe-area-inset-left);
  padding-right: env(safe-area-inset-right);
}

/* ===== NAVIGATION ===== */
.nav{
  position:sticky;top:0;z-index:100;
  background:transparent;
  border-bottom:1px solid transparent;
  padding:env(safe-area-inset-top) 1rem 0;
  transition:background .3s;
  color:#fff;
}
.nav--solid{
  background:var(--navy);
  border-bottom-color:rgba(255,255,255,.06);
}
.nav__inner{
  display:flex;align-items:center;justify-content:space-between;
  max-width:var(--max-w);margin:auto;
  height:var(--nav-h);
}
.nav__logo{display:flex;align-items:flex-end;gap:.5rem;font-weight:700;font-size:.75rem;line-height:1}
.nav__logo-icon{flex-shrink:0;line-height:0;margin-bottom:0px}
.nav__logo-icon img{height:2.9rem;width:auto}
.nav__logo-text{line-height:1;font-size:.75rem}
.nav__logo-text span{display:block;font-size:.65rem;font-weight:400;color:var(--gray);letter-spacing:.08em;text-transform:uppercase;line-height:1}
.nav__links{display:flex;gap:clamp(1rem,3vw,2.2rem);font-size:.9rem;position:relative}
.nav__links a{position:relative;padding:.25rem 0;transition:color .2s}
.nav__links a:hover,.nav__links a[aria-current="page"],.nav__links a.nav__link--active{color:var(--yellow)}
/* Minden nav link kap alávonás-barot (alapból rejtett) */
.nav__links a:not(.nav__cta):not(.nav__cta--mobile)::after{
  content:'';position:absolute;bottom:0;left:0;right:0;
  height:2px;background:var(--yellow);border-radius:1px;
  transform:scaleX(0);transform-origin:left;transition:transform .2s ease;
}
.nav__links a:not(.nav__cta):not(.nav__cta--mobile)[aria-current="page"]::after,
.nav__links a:not(.nav__cta):not(.nav__cta--mobile).nav__link--active::after{transform:scaleX(1)}
.nav__links a:not(.nav__cta):not(.nav__cta--mobile).nav__link--leaving::after{transform:scaleX(0);transition-duration:.067s}
/* Desktop: sliding indicator elem */
.nav__indicator{
  position:absolute;bottom:-2px;height:2px;
  background:var(--yellow);border-radius:1px;
  pointer-events:none;opacity:0;
  transition:left .2s cubic-bezier(.4,0,.2,1),width .2s cubic-bezier(.4,0,.2,1),opacity .15s;
}
/* Desktopon (indicator aktív) az egyéni ::after-ek el vannak rejtve */
@media(min-width:769px){
  .nav.has-indicator .nav__links a:not(.nav__cta):not(.nav__cta--mobile)::after{display:none}
}
/* Mobilon az indicator el van rejtve */
@media(max-width:768px){
  .nav__indicator{display:none}
}
.nav__cta{
  background:var(--yellow);color:var(--navy);font-weight:700;font-size:.85rem;
  padding:.6rem 1.2rem;border-radius:var(--radius);text-transform:uppercase;
  letter-spacing:.03em;transition:background .2s;
  min-height:44px;display:inline-flex;align-items:center;
}
.nav__cta:hover{background:var(--yellow-hover)}

/* Mobile menu */
.nav__burger{
  display:none;background:none;border:none;color:#fff;
  width:44px;height:44px;align-items:center;justify-content:center;
}
.nav__burger svg{width:24px;height:24px}
.nav__cta--mobile{display:none}
@media(max-width:768px){
  /* 1. Helyet csinálunk a fixált fejlécnek, hogy az oldal ne csússzon be alá */
  body {
    padding-top: calc(var(--nav-h) + env(safe-area-inset-top, 0px));
  }

  /* 2. Fixáljuk a navigációt, és levesszük az oldalsó paddingot a teljes szélességhez */
  .nav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    padding: env(safe-area-inset-top) 0 0; 
    background: rgba(26, 31, 46, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border-bottom: none !important;
  }
  
  /* Amikor nyitva van, felülírjuk a görgetési JS-t, hogy fixen sötét legyen */
  .nav:has(.nav__links.open) {
    background: rgba(26, 31, 46, 0.9) !important;
    backdrop-filter: blur(12px) !important;
    -webkit-backdrop-filter: blur(12px) !important;
    border-bottom-color: transparent !important;
  }

  /* 3. A belső konténer blokk szintű lesz, és pontosan fenntartja a fejléc magasságát */
  .nav__inner {
    position: relative;
    display: block; 
    height: auto;
    padding-top: var(--nav-h); /* Pontosan a nav-h értékétől indul majd a menü */
  }
  
  /* 4. A logót és a burgert fixen a fenntartott helyre tesszük */
  .nav__logo {
    position: absolute;
    top: 0;
    left: 1rem;
    height: var(--nav-h);
    display: flex;
    align-items: flex-end; /* Tökéletes függőleges középre igazítás */
    padding-bottom: 8px;
  }
  
  .nav__burger {
    position: absolute;
    top: 0;
    right: 1rem;
    height: var(--nav-h);
    display: flex;
    align-items: center;
  }
  
  /* 5. A menü így pontosan a fejléc aljától indul, és 100% széles lesz (széltől-szélig ér) */
  .nav__links {
    position: static;
    width: 100%;
    flex-direction: column;
    padding: 0 1.5rem;
    gap: 0;
    display: flex;
    max-height: 0;
    overflow: hidden;
    transition: max-height .35s ease, padding .35s ease, box-shadow .35s ease; /* transition leegyszerűsítve */
    background: transparent;
    border-bottom: 1px solid transparent;
  }
  
  .nav__links.open {
    max-height: 400px;
    padding: 1.5rem;
    gap: 1rem;
    border-bottom-color: rgba(255, 255, 255, 0.06);
    box-shadow: 0 15px 30px rgba(0,0,0,0.25);
  }
  
  .nav__cta-wrap { display: none; }
  .nav__cta--mobile { display: inline-flex; justify-content: center; }
  
  .nav__inner::after {
    content: '';
    position: absolute;
    top: var(--nav-h);
    left: 0;
    width: 100%;
    height: 1px;
    background: rgba(255, 255, 255, 0.06); /* A fix vonal színe */
    z-index: 10;
  }
}
  
/* ===== HERO ===== */
.hero{
  position:relative;
  margin-top:calc(-1 * var(--nav-h));
  padding:0;
  overflow:hidden;
  height:509px;
}
.hero .container{position:relative;z-index:2}
.hero__inner{
  display:grid;grid-template-columns:1fr;gap:2rem;align-items:center;
  height:100%;
  padding-top:calc(var(--nav-h) + clamp(2rem,6vw,4rem));
  padding-bottom:clamp(2rem,6vw,4rem);
}
.hero__text h1{
  font-size:clamp(1.8rem,4.5vw,3rem);font-weight:800;
  line-height:1.15;text-transform:uppercase;margin-bottom:.75rem;
}
.hero__text h1 span{display:block}
.hero__sub{font-size:clamp(1rem,2vw,1.25rem);color:var(--gray);margin-bottom:.5rem}
.hero__detail{font-size:.9rem;color:var(--gray);margin-bottom:1.5rem}

/* Hero image – full-bleed right side */
.hero__images{
  position:absolute;top:0;bottom:0;
  right:min(0px, calc((100vw - 963px) / 2));
  width:963px;
  z-index:0;overflow:hidden;
}
.hero__images::before{
  content:'';position:absolute;inset:0;z-index:1;
  background:linear-gradient(to right,var(--navy) 0%,rgba(26,31,46,.85) 25%,rgba(26,31,46,.4) 55%,transparent 90%);
  pointer-events:none;
}
.hero__img{
  display:block;height:100%;width:auto;
  position:absolute;right:0;top:0;
  transform:translateX(2px);
}

@keyframes hero-img-slide{
  from{opacity:0;transform:translateY(30px)}
  to{opacity:1;transform:translateY(0)}
}
@media(max-width:768px){
  .hero{margin-top:0;height:auto;display:flex;flex-direction:column}
  .hero .container{order:1}
  .hero__inner{grid-template-columns:1fr;text-align:center;height:auto;padding-top:clamp(2rem,6vw,4rem)}
  .hero__images{
    display:block;position:relative;order:2;
    width:100%;height:auto;
    right:auto;top:auto;bottom:auto;
    overflow:hidden;
    animation:hero-img-slide .6s ease forwards;
  }
  .hero__images::before{
    background:linear-gradient(to right,var(--navy) 0%,rgba(26,31,46,.85) 25%,rgba(26,31,46,.4) 55%,transparent 90%);
  }
  .hero__img{position:static;width:100%;height:auto;opacity:.4}
}

/* ===== CTA BUTTON (shared) ===== */
.btn{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--yellow);color:var(--navy);font-weight:700;
  padding:.85rem 1.8rem;border-radius:var(--radius);
  font-size:.95rem;text-transform:uppercase;letter-spacing:.04em;
  transition:background .2s;min-height:48px;touch-action:manipulation;
}
.btn:hover{background:var(--yellow-hover)}
.btn--outline{
  background:transparent;border:2px solid var(--yellow);color:var(--yellow);
}
.btn--outline:hover{background:var(--yellow);color:var(--navy)}

/* ===== TRUST BAR ===== */
.trust{
  background:var(--yellow);color:var(--navy);
  padding:1rem 0;margin-top:0;
}
.trust__inner{
  display:flex;justify-content:center;flex-wrap:nowrap;
  gap:clamp(.75rem,3vw,3rem);
}
.trust__item{
  display:flex;align-items:center;gap:.4rem;font-weight:700;font-size:clamp(.65rem,2.2vw,.95rem);
  text-transform:uppercase;letter-spacing:.02em;
}
.trust__icon{
  width:40px;height:40px;flex-shrink:0;border:2px solid var(--navy);border-radius:50%;
  display:flex;align-items:center;justify-content:center;font-size:1rem;
}

/* ===== SECTION COMMON ===== */
.section{padding:clamp(3rem,7vw,5rem) 0}
.section__title{
  font-size:clamp(1.5rem,3vw,2.2rem);font-weight:800;
  text-transform:uppercase;margin-bottom:.75rem;
}
.section__title span{color:var(--yellow)}
.section__sub{color:var(--gray);font-size:1rem;margin-bottom:2.5rem;max-width:600px}
.section--center{text-align:center}
.section--center .section__sub{margin-inline:auto}
@media(max-width:768px){
  .section--center{text-align:left}
  .section--center .section__sub{margin-inline:0}
}

/* ===== SERVICE CARDS ===== */
.services__grid{
  display:flex;flex-wrap:wrap;justify-content:center;gap:1.5rem;
}
.service-card{flex:1 1 280px;max-width:420px}
.service-card{
  background:var(--navy-card);border:1px solid rgba(255,255,255,.06);
  border-radius:var(--radius);padding:2rem 1.5rem;
  transition:transform .25s,box-shadow .25s;
  display:flex;flex-direction:column;text-align:left;
}
.service-card:has(.service-card__icon--blue){border-top:3px solid #60a5fa}
.service-card:has(.service-card__icon--green){border-top:3px solid #34d399}
.service-card:has(.service-card__icon--yellow){border-top:3px solid var(--yellow)}
.service-card:hover{
  transform:translateY(-4px);
  box-shadow:0 8px 30px rgba(0,0,0,.3);
}
.service-card__icon{
  width:56px;height:56px;border-radius:var(--radius);
  display:flex;align-items:center;justify-content:center;
  margin-bottom:1.25rem;font-size:1.5rem;
}
.service-card__icon svg{transition:transform .3s ease}
.service-card:hover .service-card__icon--blue svg{transform:translateY(-3px)}
.service-card:hover .service-card__icon--green svg{transform:rotate(20deg)}
.service-card:hover .service-card__icon--yellow svg{transform:scale(1.15)}

/* Icon entrance animations on scroll */
@keyframes icon-bounce{
  0%{transform:translateY(10px);opacity:0}
  50%{transform:translateY(-4px);opacity:1}
  100%{transform:translateY(0);opacity:1}
}
@keyframes icon-spin{
  0%{transform:rotate(-30deg);opacity:0}
  60%{transform:rotate(25deg);opacity:1}
  100%{transform:rotate(0);opacity:1}
}
@keyframes icon-pop{
  0%{transform:scale(0);opacity:0}
  60%{transform:scale(1.2);opacity:1}
  100%{transform:scale(1);opacity:1}
}
.service-card.in-view .service-card__icon--blue svg{animation:icon-bounce .6s ease forwards}
.service-card.in-view .service-card__icon--green svg{animation:icon-spin .6s ease forwards}
.service-card.in-view .service-card__icon--yellow svg{animation:icon-pop .6s ease forwards}
.service-card__icon--blue{background:rgba(59,130,246,.15);color:#60a5fa}
.service-card__icon--green{background:rgba(16,185,129,.15);color:#34d399}
.service-card__icon--yellow{background:rgba(255,193,7,.15);color:var(--yellow)}
.service-card h3{font-size:1.25rem;font-weight:700;margin-bottom:.6rem}
.service-card>p{font-size:.85rem;color:var(--gray);margin-bottom:1rem;line-height:1.6}
.service-card ul{margin-bottom:1.25rem;flex:1}
.service-card li{
  font-size:.88rem;color:var(--gray);padding:.25rem 0;padding-left:1rem;
  position:relative;
}
.service-card li::before{
  content:'•';position:absolute;left:0;color:var(--yellow);
}
.service-card__link{
  color:var(--yellow);font-weight:600;font-size:.9rem;
  display:inline-flex;align-items:center;gap:.3rem;
  margin-top:auto;
}
.service-card__link:hover{text-decoration:underline}

/* ===== ABOUT SECTION ===== */
.about__inner{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(2rem,5vw,4rem);
  align-items:start;
}
.about__img{
  width:clamp(200px,25vw,340px);border-radius:var(--radius);
  aspect-ratio:3/4;object-fit:cover;
  border:3px solid var(--navy-light);
}
.about__text h2{
  font-size:clamp(1.5rem,3vw,2.2rem);font-weight:800;
  text-transform:uppercase;margin-bottom:1rem;line-height:1.2;
}
.about__text p{color:var(--gray);margin-bottom:1.25rem;max-width:520px}
.about__phone{
  display:inline-flex;align-items:center;gap:.5rem;
  font-weight:700;font-size:1.05rem;
}
.about__phone svg{width:20px;height:20px}
@media(max-width:768px){
  .about__inner{grid-template-columns:1fr;text-align:center;justify-items:center}
}

/* ===== PORTFOLIO GRID ===== */
.portfolio__grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.25rem;
}
.portfolio__item{
  position:relative;border-radius:var(--radius);overflow:hidden;
  aspect-ratio:4/3;
}
.portfolio__item img{
  width:100%;height:100%;object-fit:cover;
  transition:transform .35s;
}
.portfolio__item:hover img{transform:scale(1.05)}
.portfolio__badge{
  position:absolute;bottom:.75rem;left:.75rem;
  background:var(--yellow);color:var(--navy);
  font-size:.7rem;font-weight:700;text-transform:uppercase;
  padding:.3rem .7rem;border-radius:4px;letter-spacing:.03em;
}
.portfolio__caption{
  font-size:.85rem;font-weight:600;margin-top:.5rem;text-align:center;
}
@media(max-width:768px){
  .portfolio__grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:480px){
  .portfolio__grid{grid-template-columns:1fr}
}

/* ===== CONTACT / CTA SECTION ===== */
.contact{
  background:var(--navy-light);
  padding:clamp(3rem,7vw,5rem) 0;
}
.contact__inner{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);
  align-items:start;
}
.contact__title{
  font-size:clamp(1.5rem,3vw,2.2rem);font-weight:800;
  text-transform:uppercase;margin-bottom:1.5rem;line-height:1.2;
}
.contact__title span{color:var(--yellow)}
.contact__info{display:flex;flex-direction:column;gap:.75rem}
.contact__info-item{
  display:flex;align-items:center;gap:.6rem;font-size:.95rem;color:var(--gray);
}
.contact__info-item svg{width:20px;height:20px;color:var(--yellow);flex-shrink:0}
.contact__info-item a{color:var(--yellow);font-weight:600}
.contact__info-item a:hover{text-decoration:underline}

/* Form */
.form{display:flex;flex-direction:column;gap:1rem}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.form input,.form textarea{
  width:100%;background:var(--navy);border:1px solid rgba(255,255,255,.1);
  border-radius:var(--radius);padding:.85rem 1rem;color:#fff;
  font-size:1rem;transition:border-color .2s;
}
.form input::placeholder,.form textarea::placeholder{color:var(--gray)}
.form input:focus,.form textarea:focus{border-color:var(--yellow)}
.form textarea{resize:vertical;min-height:110px}
.form .btn{width:100%}
@media(max-width:768px){
  .contact__inner{grid-template-columns:1fr}
  .form__row{grid-template-columns:1fr}
}

/* ===== FOOTER ===== */
.footer{
  background:#1a1f2e;
  border-top:1px solid rgba(255,255,255,.06);
  padding:1.25rem 0;
  color:#fff;
}
.footer__inner{
  display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;
}
.footer__logo{display:flex;align-items:flex-end;gap:.4rem;padding-bottom:8px}
.footer__logo-icon{flex-shrink:0;line-height:0}
.footer__logo-icon img{height:2.1rem;width:auto;display: block}
.footer__logo .nav__logo-text {
  font-size: 0.55rem;
  line-height: 1.1;
  font-weight: 700;
}
.footer__logo .nav__logo-text span {
  font-size: 0.48rem;
  font-weight: 400;
  color: var(--gray);
  letter-spacing: .06em;
  text-transform: uppercase;
  line-height: 1;
  display: block;
}
.footer__copy{font-size:.8rem;color:var(--gray)}
.footer__copy a{color:var(--gray);text-decoration:underline}
.footer__social{display:flex;gap:.75rem;justify-content:center}
.footer__social a{
  width:36px;height:36px;display:flex;align-items:center;justify-content:center;
  border-radius:50%;border:1px solid rgba(255,255,255,.15);
  transition:background .2s,border-color .2s;color:var(--gray);
}
.footer__social a:hover{background:var(--yellow);color:var(--navy);border-color:var(--yellow)}
.footer__social svg{width:16px;height:16px}

@media(max-width: 768px) {
  .footer__inner {
    /* Space-between helyett középre rendezzük az elemeket, ha egymás alá kerülnek */
    justify-content: center; 
    flex-direction: column;  /* Egymás alá rendezzük őket a biztosabb siker érdekében */
    gap: 1.5rem;             /* Kicsit nagyobb távolság a logó, a szöveg és az ikonok között */
    text-align: center;      /* A copyright szöveget is középre teszi */
    padding-bottom:15px;
  }

  .footer__copy {
    order: 2; /* Sorrend: Logó (1), Szöveg (2), Ikonok (3) */
  }
  
  .footer__social {
    order: 3;
  }
}

/* ===== PAGE HERO (inner pages) ===== */
.page-hero{
  padding:clamp(3rem,8vw,5rem) 0 clamp(2rem,5vw,3rem);
  text-align:center;
  background:linear-gradient(180deg,rgba(250,235,215,.06) 0%,transparent 100%);
}
.page-hero h1{
  font-size:clamp(1.8rem,4vw,2.8rem);font-weight:800;text-transform:uppercase;
  margin-bottom:.75rem;
}
.page-hero p{color:var(--gray);max-width:600px;margin:auto;font-size:1.05rem}

/* ===== SERVICES PAGE ===== */
.service-detail{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);
  align-items:start;padding:clamp(2rem,4vw,3rem) 0;
  border-bottom:1px solid rgba(255,255,255,.06);
}
.service-detail:nth-child(even){direction:rtl}
.service-detail:nth-child(even)>*{direction:ltr}
.service-detail__img-wrap{
  overflow:hidden;border-radius:var(--radius);
  margin-top:calc(1.2 * clamp(1.3rem,2.5vw,1.8rem) + 1rem);
}
.service-detail__img{
  width:100%;aspect-ratio:4/3;object-fit:cover;
  background:var(--navy-card);
  transition:transform .4s ease;
}
.service-detail__img-wrap:hover .service-detail__img{transform:scale(1.05)}
.service-detail h2{font-size:clamp(1.3rem,2.5vw,1.8rem);margin-bottom:1rem;line-height:1.2}
.service-detail p{color:var(--gray);margin-bottom:1rem}
.service-detail ul{margin-bottom:1.5rem}
.service-detail li{
  color:var(--gray);padding:.3rem 0 .3rem 1.2rem;position:relative;font-size:.92rem;
}
.service-detail li::before{content:'✓';position:absolute;left:0;color:var(--yellow);font-weight:700}
@media(max-width:768px){
  .service-detail,.service-detail:nth-child(even){grid-template-columns:1fr;direction:ltr}
}

/* ===== REFERENCES PAGE ===== */
.ref-filter{
  display:flex;justify-content:center;flex-wrap:wrap;gap:.5rem;margin-bottom:2rem;
}
.ref-filter button{
  background:var(--navy-card);border:1px solid rgba(255,255,255,.1);
  color:var(--gray);padding:.5rem 1.2rem;border-radius:var(--radius);
  font-size:.85rem;font-weight:600;transition:all .2s;min-height:44px;
  touch-action:manipulation;
}
.ref-filter button:hover,.ref-filter button.active{
  background:var(--yellow);color:var(--navy);border-color:var(--yellow);
}

.ref-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem;
}
.ref-card{
  position:relative;border-radius:var(--radius);overflow:hidden;
  border:1px solid rgba(255,255,255,.1);
  transition:transform .25s,box-shadow .25s;
}
.ref-card:hover{
  transform:translateY(-3px);
  box-shadow:0 8px 30px rgba(0,0,0,.3);
}
.ref-card__img{width:100%;display:block;transition:transform .5s ease}
.ref-card:hover .ref-card__img{transform:scale(1.05)}
.ref-card__body{
  position:absolute;bottom:0;left:0;right:0;
  padding:1.25rem;
  background:rgba(26,31,46,.8);
  transition:transform .4s ease;
}
/* Desktop hover: text slides down; bottom zone brings it back */
@media(hover:hover){
  .ref-card:hover .ref-card__body{transform:translateY(100%)}
  .ref-card.text-visible .ref-card__body{transform:translateY(0)}
}
/* Mobile touch toggle */
.ref-card.text-hidden .ref-card__body{transform:translateY(100%)}
.ref-card__badge{
  display:inline-block;background:var(--yellow);color:var(--navy);
  font-size:.7rem;font-weight:700;text-transform:uppercase;
  padding:.2rem .6rem;border-radius:3px;margin-bottom:.5rem;
}
.ref-card__body h3{font-size:1rem;margin-bottom:.35rem;color:#fff}
.ref-card__body p{font-size:.85rem;color:var(--gray)}
@media(max-width:768px){.ref-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:480px){.ref-grid{grid-template-columns:1fr}}

/* ===== ABOUT PAGE ===== */
.about-full__section{background:var(--navy)}
.about-full__inner{
  display:grid;grid-template-columns:0.5fr 1fr;gap:clamp(1.5rem,3vw,2.5rem);
  align-items:start;
}
.about-full__img{
  width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:var(--radius);
  background:var(--navy-card);
}
.about-full__text h2{font-size:clamp(1.3rem,2.5vw,1.8rem);margin-bottom:1rem}
.about-full__text p{color:var(--gray);margin-bottom:1rem}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin:2rem 0}
.stat{text-align:center}
.stat__num{font-size:clamp(1.8rem,3vw,2.5rem);font-weight:800;color:var(--yellow)}
.stat__label{font-size:.8rem;color:var(--gray);text-transform:uppercase;letter-spacing:.04em}
.values{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin-top:2rem}
.value-card{
  background:var(--navy-card);padding:1.5rem;border-radius:var(--radius);
  border:1px solid rgba(255,255,255,.06);
}
.value-card h3{font-size:1rem;margin-bottom:.5rem;display:flex;align-items:center;gap:.5rem}
.value-card p{font-size:.85rem;color:var(--gray)}
@media(max-width:768px){
  .about-full__inner{grid-template-columns:1fr}
}

/* ===== PLACEHOLDER IMAGES ===== */
.placeholder-img{
  background:var(--navy-card);display:flex;align-items:center;justify-content:center;
  color:var(--gray);font-size:.8rem;text-align:center;
}