/* ============================================================
   AURA GIFTS — responsive.css
   1920 / 1440 / 1366 / 1024 / 768 / 430 / 390 / 375
   ============================================================ */

/* ---------- Large desktop ---------- */
@media (min-width:1600px){
  :root{--gutter:clamp(60px,6vw,140px);--header-h:104px}
  .hero-copy{max-width:min(52rem,46%)}
}

/* ---------- Laptop 1366 & below ---------- */
@media (max-width:1440px){
  .hero-copy h1{font-size:clamp(2.7rem,5.6vw,4.8rem)}
  .services-grid{gap:20px}
}

/* ---------- 1280 ---------- */
@media (max-width:1280px){
  .main-nav ul{gap:18px}
  .nav-link{font-size:.68rem;letter-spacing:.12em}
  .prod-grid{grid-template-columns:repeat(3,1fr)}
  .gallery-grid{columns:3}
}

/* ---------- 1024 / tablet landscape ---------- */
@media (max-width:1024px){
  :root{--header-h:76px}
  .main-nav,.header-actions .btn{display:none}
  .nav-toggle{display:block}

  .hero{min-height:auto;padding:calc(var(--header-h) + 46px) var(--gutter) 130px;align-items:flex-start}
  .hero-copy{max-width:100%}
  .hero-copy h1{font-size:clamp(2.6rem,8.4vw,4.2rem)}
  .hero-content{position:relative;z-index:4}
  #hero-canvas{z-index:1}
  .hero-fg{z-index:2}
  .hero-frame{z-index:0}

  .intro-grid,.story-grid,.contact-grid{grid-template-columns:1fr;gap:44px}
  .intro-media{max-width:620px}
  .services-grid{grid-template-columns:repeat(2,1fr)}
  .collection-grid{grid-template-columns:repeat(2,1fr)}
  .col-card:nth-child(n){grid-column:span 1;min-height:340px}
  .col-card:nth-child(6){grid-column:span 2;min-height:340px}
  .timeline{grid-template-columns:repeat(2,1fr);row-gap:44px}
  .timeline::before,.timeline__bar{display:none}
  .tl-step{padding-top:0;padding-left:88px}
  .tl-step b{top:0;left:0}
  .stats-wrap{grid-template-columns:repeat(3,1fr)}
  .benefits{grid-template-columns:repeat(2,1fr)}
  .prod-grid{grid-template-columns:repeat(2,1fr)}
  .gallery-grid{columns:2}
  .svc-row{grid-template-columns:1fr;gap:26px}
  .svc-row:nth-child(even) .svc-media{order:0}
  .svc-media img{aspect-ratio:16/10}
  .footer-grid{grid-template-columns:1fr 1fr;gap:40px}
  .hero-selector{position:static;flex-direction:row;flex-wrap:wrap;gap:8px 20px;margin-top:34px;align-items:center}
  .hero-selector .ps-name{display:none}
  .hero-scroll{display:none}
  .float-social{top:auto;bottom:96px;transform:none;flex-direction:row;right:16px}
  .float-social a{width:42px;height:42px}
  .float-wa{right:14px;bottom:18px;width:52px;height:52px}
}

/* ---------- 768 / tablet ---------- */
@media (max-width:768px){
  :root{--gutter:22px}
  body{line-height:1.7}
  .section{padding:64px var(--gutter)}
  .hero{padding:calc(var(--header-h) + 30px) var(--gutter) 84px}
  .hero-copy h1{font-size:clamp(2.3rem,10vw,3.2rem);line-height:1.04}
  .hero-tags{gap:8px 16px;font-size:.6rem;letter-spacing:.22em}
  .hero-actions .btn{width:100%}
  .hero-actions{gap:12px}
  .page-hero{min-height:auto;padding:calc(var(--header-h) + 44px) var(--gutter) 54px}
  .page-hero h1{font-size:clamp(2rem,9vw,2.8rem)}

  .services-grid{grid-template-columns:1fr}
  .service-card__body{padding:22px 20px 26px;transform:none}
  .collection-grid{grid-template-columns:1fr}
  .col-card:nth-child(n),.col-card:nth-child(6){grid-column:span 1;min-height:300px}
  .stats-wrap{grid-template-columns:1fr}
  .benefits{grid-template-columns:1fr}
  .timeline{grid-template-columns:1fr}
  .prod-grid{grid-template-columns:1fr 1fr;gap:12px}
  .prod-item__body{padding:14px 14px 16px}
  .prod-item__body h4{font-size:1rem}
  .gallery-grid{columns:1}
  .form-grid{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;gap:34px}
  .intro-media .img-float{width:44%;right:-4%;bottom:-8%}
  .intro-media .badge-gold{width:92px;height:92px;left:-2%}
  .form-wrap{padding:24px 20px}
  .lb-prev{left:6px}.lb-next{right:6px}
  .lb-close{top:-52px}
  .lightbox__cap{flex-direction:column;gap:6px;text-align:center}
  .marquee__item{width:64vw}
  .cta-actions .btn{width:100%}
  .float-social a .tip{display:none}
}

/* ---------- 430 / 390 / 375 mobile ---------- */
@media (max-width:430px){
  :root{--gutter:18px;--header-h:70px}
  .display-1,.h-xl{font-size:clamp(2.05rem,10.5vw,2.7rem)}
  .display-2{font-size:clamp(1.75rem,8.6vw,2.25rem)}
  .display-3{font-size:1.4rem}
  .eyebrow{font-size:.6rem;letter-spacing:.32em}
  .eyebrow::before{width:22px}
  .lead{font-size:.95rem;line-height:1.8}
  .btn{padding:14px 22px;font-size:.66rem;letter-spacing:.18em}
  .brand-name{font-size:.98rem;letter-spacing:.26em}
  .brand-sub{font-size:.44rem;letter-spacing:.42em}
  .brand-mark{width:36px;height:36px}
  .hero-copy h1{font-size:clamp(1.95rem,10.6vw,2.6rem)}
  .hero-tags{font-size:.56rem;letter-spacing:.18em}
  .stat b{font-size:2.1rem}
  .service-card__body h3{font-size:1.22rem}
  .tl-step{padding-left:74px}
  .tl-step b{width:58px;height:58px;font-size:.82rem}
  .prod-grid{grid-template-columns:1fr 1fr;gap:10px}
  .prod-item__body h4{font-size:.95rem}
  .prod-item__body span{font-size:.54rem;letter-spacing:.16em}
  .filter-btn{padding:9px 15px;font-size:.6rem;letter-spacing:.14em}
  .gal-item__ov{padding:14px}
  .gal-item__ov b{font-size:.95rem}
  .info-card p,.info-card a{font-size:1.08rem}
  .field label{font-size:.58rem;letter-spacing:.2em}
  .field input,.field select,.field textarea{padding:12px 13px;font-size:.9rem}
  .footer-bottom{flex-direction:column;text-align:center}
  .float-social{gap:8px;right:12px;bottom:88px}
  .float-social a{width:38px;height:38px}
  .float-wa{width:48px;height:48px;right:12px;bottom:14px}
  .hero-selector button{font-size:.56rem;letter-spacing:.16em}
  .hero-selector button i{width:14px}
  .hero-selector button.active i{width:26px}
  .marquee__item{width:74vw}
  .form-success h3{font-size:1.5rem}
}

/* ---------- Short landscape phones ---------- */
@media (max-height:520px) and (orientation:landscape){
  .hero{min-height:auto;padding-top:calc(var(--header-h) + 24px);padding-bottom:60px}
  #hero-canvas{position:absolute;inset:0}
  .mobile-nav{justify-content:flex-start;overflow-y:auto}
}

/* ---------- Very small ---------- */
@media (max-width:340px){
  .hero-copy h1{font-size:1.75rem}
  .prod-grid{grid-template-columns:1fr}
}

/* ---------- Hover-capable devices only ---------- */
@media (hover:hover) and (pointer:fine){
  .service-card:hover{transform:perspective(900px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg)) translateZ(0)}
}