/* ═══════════════════════════════════════════════════════════
   mallorcafotobox.com — Main Stylesheet
   Design: Luxury Dark Editorial — Navy/Gold
════════════════════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;1,300;1,400&family=DM+Sans:wght@300;400;500&display=swap');

/* ── Variables ─────────────────────────────────────────── */
:root {
  --bg:        #0a0a0f;
  --bg2:       #111118;
  --bg-card:   #16161f;
  --bg-card2:  #1c1c27;
  --gold:      #c9a96e;
  --gold-lt:   #e8cfa0;
  --gold-dk:   #8a6f45;
  --white:     #f5f3ef;
  --muted:     #888899;
  --border:    rgba(201,169,110,.15);
  --border2:   rgba(201,169,110,.30);
  --font-d:    'Cormorant Garamond', Georgia, serif;
  --font-b:    'DM Sans', system-ui, sans-serif;
  --ease:      cubic-bezier(.25,.46,.45,.94);
  --py:        clamp(4rem,8vw,7rem);
  --w:         min(1200px,92vw);
}

/* ── Reset ─────────────────────────────────────────────── */
*,*::before,*::after { box-sizing:border-box; margin:0; padding:0; }
html { scroll-behavior:smooth; -webkit-font-smoothing:antialiased; font-size:16px; }
body { font-family:var(--font-b); background:var(--bg); color:var(--white); line-height:1.7; overflow-x:hidden; }
a { color:inherit; text-decoration:none; }
img { max-width:100%; height:auto; display:block; }
button { cursor:pointer; font-family:var(--font-b); border:none; background:none; color:inherit; }
ul { list-style:none; }

/* ── Utilities ─────────────────────────────────────────── */
.container { width:var(--w); margin:0 auto; }
.gold-text  { color:var(--gold); }
.muted      { color:var(--muted); }

.section-label {
  display:flex; align-items:center; gap:.75rem;
  font-size:.7rem; font-weight:500; letter-spacing:.2em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1.25rem;
}
.section-label::before {
  content:''; display:block; width:2rem; height:1px; background:var(--gold); flex-shrink:0;
}
.section-title {
  font-family:var(--font-d); font-weight:400;
  font-size:clamp(2.2rem,3.5vw,3.5rem); line-height:1.1; color:var(--white);
}
.gold-divider { width:3rem; height:1px; background:var(--gold); margin:1.5rem 0; }
.page-top-spacer { height:6rem; }

/* ── Buttons ───────────────────────────────────────────── */
.btn-primary {
  display:inline-flex; align-items:center; gap:.5rem;
  background:var(--gold); color:var(--bg);
  padding:.85rem 2rem; border-radius:2px;
  font-size:.85rem; font-weight:500; letter-spacing:.05em; text-transform:uppercase;
  transition:background .2s var(--ease), transform .15s var(--ease);
}
.btn-primary:hover { background:var(--gold-lt); transform:translateY(-1px); }
.btn-primary:active { transform:translateY(0); }

.btn-outline {
  display:inline-flex; align-items:center; gap:.5rem;
  border:1px solid var(--border2); color:var(--white);
  padding:.85rem 2rem; border-radius:2px;
  font-size:.85rem; font-weight:400; letter-spacing:.05em; text-transform:uppercase;
  transition:border-color .2s var(--ease), color .2s var(--ease), transform .15s var(--ease);
}
.btn-outline:hover { border-color:var(--gold); color:var(--gold); transform:translateY(-1px); }

.btn-sm  { padding:.65rem 1.4rem !important; font-size:.8rem !important; }
.btn-full { width:100%; justify-content:center; margin-top:auto; }

/* ══════════════════════════════════════════════════════════
   HEADER
════════════════════════════════════════════════════════════ */
.site-header {
  position:fixed; top:0; left:0; right:0; z-index:100;
  padding:1.25rem 0;
  transition:background .3s, padding .3s, border-bottom .3s;
}
.site-header.scrolled {
  background:rgba(10,10,15,.95);
  backdrop-filter:blur(12px);
  border-bottom:1px solid var(--border);
  padding:.85rem 0;
}
.header-inner {
  display:flex; align-items:center; gap:2rem;
}
.logo { display:flex; align-items:center; gap:.5rem; flex-shrink:0; }
.logo-mark { color:var(--gold); font-size:1.2rem; line-height:1; }
.logo-text  { font-size:1rem; font-weight:300; color:var(--white); letter-spacing:.02em; }
.logo-text strong { font-weight:500; color:var(--gold); }

.main-nav { display:flex; align-items:center; gap:.25rem; margin-left:auto; }
.nav-link {
  font-size:.8rem; font-weight:400; letter-spacing:.06em; text-transform:uppercase;
  color:var(--muted); padding:.4rem .75rem; border-radius:2px;
  transition:color .2s;
}
.nav-link:hover, .nav-link.active { color:var(--white); }
.nav-link.active { color:var(--gold); }

.header-actions { display:flex; align-items:center; gap:1rem; flex-shrink:0; }
.lang-switch {
  font-size:.75rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--border); padding:.35rem .65rem; border-radius:2px;
  transition:color .2s, border-color .2s;
}
.lang-switch:hover { color:var(--gold); border-color:var(--gold); }

/* Burger */
.burger { display:none; flex-direction:column; gap:5px; padding:4px; margin-left:auto; }
.burger span { display:block; width:22px; height:1.5px; background:var(--white); transition:all .25s; transform-origin:center; }
.burger.open span:nth-child(1) { transform:rotate(45deg) translate(4.5px,4.5px); }
.burger.open span:nth-child(2) { opacity:0; }
.burger.open span:nth-child(3) { transform:rotate(-45deg) translate(4.5px,-4.5px); }

/* Mobile menu */
.mobile-menu {
  background:var(--bg2); border-top:1px solid var(--border);
  display:flex; flex-direction:column; padding:1.5rem var(--w); gap:.25rem;
}
.mobile-menu[hidden] { display:none; }
.mobile-link {
  font-size:.85rem; letter-spacing:.06em; text-transform:uppercase;
  color:var(--muted); padding:.75rem 0; border-bottom:1px solid var(--border);
}
.mobile-link:hover { color:var(--white); }
.mobile-cta {
  margin-top:1rem; font-size:.8rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase;
  color:var(--bg); background:var(--gold); padding:.85rem 1.5rem; border-radius:2px; text-align:center;
}
.mobile-lang { font-size:.75rem; color:var(--muted); text-align:center; padding:.5rem 0; }

/* ══════════════════════════════════════════════════════════
   HERO
════════════════════════════════════════════════════════════ */
.hero {
  position:relative; min-height:100svh;
  display:flex; align-items:center;
  padding:8rem 0 5rem; overflow:hidden;
}
.hero-bg { position:absolute; inset:0; pointer-events:none; }
.hero-grid {
  position:absolute; inset:0;
  background-image:
    linear-gradient(rgba(201,169,110,.04) 1px,transparent 1px),
    linear-gradient(90deg,rgba(201,169,110,.04) 1px,transparent 1px);
  background-size:60px 60px;
  mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black,transparent);
}
.hero-glow {
  position:absolute; top:-20%; right:-10%; width:60%; height:80%;
  background:radial-gradient(ellipse,rgba(201,169,110,.06) 0%,transparent 65%);
}
.hero-inner { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.hero-content { display:flex; flex-direction:column; }

.hero-badge {
  display:inline-flex; align-items:center; gap:.6rem;
  font-size:.7rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase;
  color:var(--gold); border:1px solid var(--border2); padding:.4rem .9rem;
  border-radius:20px; width:fit-content; margin-bottom:1.75rem;
  animation:fadeUp .6s ease both;
}
.badge-dot {
  width:6px; height:6px; border-radius:50%; background:var(--gold);
  animation:pulse 2s ease infinite;
}
.hero-title {
  font-family:var(--font-d);
  font-size:clamp(3rem,5.5vw,5.5rem);
  font-weight:300; line-height:1.05; letter-spacing:-.01em;
  color:var(--white); margin-bottom:1.5rem;
  animation:fadeUp .6s .1s ease both;
}
.hero-sub {
  font-size:clamp(.9rem,1.2vw,1.05rem); color:var(--muted);
  line-height:1.7; max-width:44ch; margin-bottom:2.5rem;
  animation:fadeUp .6s .2s ease both;
}
.hero-ctas { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; margin-bottom:2.5rem; animation:fadeUp .6s .3s ease both; }
.trust-badges { display:flex; align-items:center; gap:1rem; flex-wrap:wrap; animation:fadeUp .6s .4s ease both; }
.trust-item { display:flex; align-items:center; gap:.4rem; font-size:.78rem; color:var(--muted); }
.trust-check { color:var(--gold); font-size:.7rem; }
.trust-div { width:1px; height:14px; background:var(--border2); }

/* Photo strip mockup */
.hero-visual { display:flex; justify-content:center; align-items:center; animation:fadeUp .6s .2s ease both; }
.photo-strip {
  width:200px; background:var(--white); border-radius:3px; padding:12px;
  display:flex; flex-direction:column; gap:8px;
  box-shadow:0 0 80px rgba(201,169,110,.15),0 0 0 1px rgba(201,169,110,.2);
  transform:rotate(-3deg); position:relative;
}
.photo-slot { width:100%; aspect-ratio:4/3; background:linear-gradient(135deg,#1c1c27,#2a2a3a); border-radius:2px; }
.photo-meta { display:flex; justify-content:space-between; padding:4px 0 2px; font-size:.55rem; color:var(--bg); opacity:.5; letter-spacing:.05em; }
.photo-float { position:absolute; border-radius:2px; }
.photo-float-1 { top:-30px; right:-50px; width:150px; aspect-ratio:4/3; background:var(--bg-card2); border:1px solid var(--border2); transform:rotate(6deg); }
.photo-float-2 { bottom:-20px; left:-40px; width:130px; aspect-ratio:4/3; background:var(--bg-card); border:1px solid var(--border); transform:rotate(-8deg); }

.scroll-hint { position:absolute; bottom:2rem; left:50%; transform:translateX(-50%); }
.scroll-line { width:1px; height:40px; background:linear-gradient(to bottom,var(--gold),transparent); animation:scrollDown 1.5s ease infinite; }

/* ══════════════════════════════════════════════════════════
   USP
════════════════════════════════════════════════════════════ */
.usp-section { padding:var(--py) 0; background:var(--bg); }
.usp-section .container { }
.usp-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:1px; background:var(--border);
  border:1px solid var(--border); border-radius:4px; overflow:hidden;
  margin-top:3rem;
}
.usp-card { background:var(--bg); padding:2.5rem 2rem; display:flex; flex-direction:column; gap:1rem; transition:background .3s; }
.usp-card:hover { background:var(--bg-card); }
.usp-icon { color:var(--gold); font-size:1.5rem; }
.usp-title { font-family:var(--font-d); font-size:1.4rem; font-weight:400; color:var(--white); line-height:1.2; }
.usp-desc { font-size:.85rem; color:var(--muted); line-height:1.7; }

/* ══════════════════════════════════════════════════════════
   PACKAGES
════════════════════════════════════════════════════════════ */
.packages-section { padding:var(--py) 0; background:var(--bg2); }
.section-header { text-align:center; margin-bottom:3.5rem; }
.section-header .section-label { justify-content:center; }

.packages-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.5rem; align-items:start; }
.pkg-card {
  background:var(--bg-card); border:1px solid var(--border); border-radius:4px;
  padding:2.5rem 2rem; display:flex; flex-direction:column; gap:1.5rem;
  position:relative; transition:border-color .3s, transform .3s;
}
.pkg-card:hover { border-color:var(--border2); transform:translateY(-4px); }
.pkg-popular { border-color:var(--gold-dk); background:var(--bg-card2); transform:translateY(-8px); }
.pkg-popular:hover { transform:translateY(-12px); }
.pkg-popular-badge {
  position:absolute; top:-14px; left:50%; transform:translateX(-50%);
  background:var(--gold); color:var(--bg);
  font-size:.65rem; font-weight:500; letter-spacing:.1em; text-transform:uppercase;
  padding:.3rem 1rem; border-radius:20px; white-space:nowrap;
}
.pkg-name { font-size:.7rem; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); }
.pkg-price { display:flex; align-items:baseline; gap:.2rem; }
.pkg-currency { font-family:var(--font-d); font-size:1.5rem; color:var(--muted); line-height:1; }
.pkg-amount  { font-family:var(--font-d); font-size:4rem; font-weight:300; color:var(--white); line-height:1; letter-spacing:-.02em; }
.pkg-duration { font-size:.8rem; color:var(--muted); }
.pkg-divider { height:1px; background:var(--border); }
.pkg-features { display:flex; flex-direction:column; gap:.65rem; }
.pkg-features li { display:flex; align-items:flex-start; gap:.6rem; font-size:.85rem; color:var(--muted); line-height:1.5; }
.pkg-check { color:var(--gold); font-size:.6rem; flex-shrink:0; margin-top:.25rem; }

/* ══════════════════════════════════════════════════════════
   GALLERY
════════════════════════════════════════════════════════════ */
.gallery-section { padding:var(--py) 0; background:var(--bg); }
.gallery-section h1.section-title { margin-bottom:.5rem; }
.gallery-filters { display:flex; gap:.5rem; flex-wrap:wrap; margin-bottom:2.5rem; }
.filter-btn {
  font-size:.72rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase;
  color:var(--muted); border:1px solid var(--border); padding:.5rem 1.2rem; border-radius:2px;
  transition:all .2s;
}
.filter-btn:hover { color:var(--white); border-color:var(--border2); }
.filter-active { color:var(--bg) !important; background:var(--gold); border-color:var(--gold) !important; }

.gallery-grid {
  display:grid; grid-template-columns:repeat(3,1fr);
  grid-auto-rows:220px; gap:8px;
}
.gallery-cell { overflow:hidden; border-radius:2px; }
.gallery-wide { grid-column:span 2; }
.gallery-placeholder {
  width:100%; height:100%;
  background:var(--bg-card2); border:1px solid var(--border);
  display:flex; align-items:flex-end; padding:.75rem;
  transition:transform .4s;
}
.gallery-cell:hover .gallery-placeholder { transform:scale(1.02); }
.gallery-cat-label { font-size:.65rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); }

/* ══════════════════════════════════════════════════════════
   FAQ
════════════════════════════════════════════════════════════ */
.faq-section { padding:var(--py) 0; background:var(--bg2); }
.faq-layout { display:grid; grid-template-columns:1fr 2fr; gap:5rem; align-items:start; }
.faq-left { position:sticky; top:7rem; }
.faq-left .section-title { font-size:clamp(2rem,3vw,3rem); margin-bottom:1.5rem; }
.faq-right { display:flex; flex-direction:column; }
.faq-item { border-bottom:1px solid var(--border); }
.faq-item:first-child { border-top:1px solid var(--border); }
.faq-q {
  width:100%; display:flex; justify-content:space-between; align-items:center; gap:1rem;
  padding:1.4rem 0; font-size:.95rem; font-weight:400; color:var(--white);
  text-align:left; transition:color .2s;
}
.faq-q:hover { color:var(--gold); }
.faq-item.open .faq-q { color:var(--gold); }
.faq-icon { font-size:1.4rem; font-weight:300; color:var(--gold); flex-shrink:0; width:24px; text-align:center; line-height:1; }
.faq-a { padding:0 0 1.5rem; }
.faq-a[hidden] { display:none; }
.faq-a p { font-size:.87rem; color:var(--muted); line-height:1.8; max-width:58ch; }

/* ══════════════════════════════════════════════════════════
   CONTACT
════════════════════════════════════════════════════════════ */
.contact-section { padding:var(--py) 0; background:var(--bg); }
.contact-layout { display:grid; grid-template-columns:1fr 1.6fr; gap:5rem; align-items:start; }
.contact-info { position:sticky; top:7rem; }
.contact-info .section-title { font-size:clamp(2rem,3vw,3rem); margin-bottom:1.5rem; }
.contact-details { display:flex; flex-direction:column; gap:1.25rem; margin:2rem 0; }
.contact-item { display:flex; flex-direction:column; gap:.2rem; }
.contact-label { font-size:.65rem; font-weight:500; letter-spacing:.12em; text-transform:uppercase; color:var(--gold); }
.contact-value { font-size:.9rem; color:var(--white); transition:color .2s; }
.contact-value:hover { color:var(--gold); }
.trust-list { display:flex; flex-direction:column; gap:.6rem; }
.trust-row { display:flex; align-items:center; gap:.6rem; font-size:.82rem; color:var(--muted); }

.form-wrap { background:var(--bg-card); border:1px solid var(--border); border-radius:4px; padding:2.5rem; }
.contact-form { display:flex; flex-direction:column; gap:1.25rem; }
.form-row { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.form-field { display:flex; flex-direction:column; gap:.4rem; }
.form-field label { font-size:.72rem; font-weight:500; letter-spacing:.08em; text-transform:uppercase; color:var(--muted); }
input,select,textarea {
  font-family:var(--font-b);
  background:var(--bg-card2); border:1px solid var(--border2); color:var(--white);
  border-radius:4px; padding:.75rem 1rem; width:100%; font-size:.95rem;
  transition:border-color .2s; outline:none; appearance:none;
}
input:focus,select:focus,textarea:focus { border-color:var(--gold); }
input::placeholder,textarea::placeholder { color:var(--muted); }
select option { background:var(--bg-card2); }
textarea { resize:vertical; }

.form-error {
  font-size:.82rem; color:#e24b4a;
  background:rgba(226,75,74,.08); border:1px solid rgba(226,75,74,.2);
  padding:.6rem .9rem; border-radius:2px;
}
.form-success {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:1.5rem; min-height:200px; text-align:center;
}
.form-success-icon { font-size:2.5rem; color:var(--gold); }
.form-success h3 { font-family:var(--font-d); font-size:1.5rem; font-weight:400; color:var(--white); }

/* ══════════════════════════════════════════════════════════
   LEGAL / IMPRESSUM
════════════════════════════════════════════════════════════ */
.legal-section { padding:8rem 0 5rem; min-height:60vh; }
.legal-content h1 { font-family:var(--font-d); font-size:clamp(2.5rem,4vw,4rem); font-weight:300; color:var(--white); margin-bottom:3rem; }
.legal-block { margin-bottom:2.5rem; max-width:60ch; }
.legal-block h2 { font-size:.7rem; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); margin-bottom:.75rem; }
.legal-block p { font-size:.9rem; color:var(--muted); line-height:1.8; }
.legal-block a { color:var(--gold); }
.legal-block a:hover { color:var(--gold-lt); }

/* ══════════════════════════════════════════════════════════
   404
════════════════════════════════════════════════════════════ */
.error-page { min-height:100svh; display:flex; align-items:center; padding:4rem 0; }
.error-code { font-family:var(--font-d); font-size:8rem; font-weight:300; color:var(--border2); line-height:1; margin-bottom:1rem; }
.error-title { font-family:var(--font-d); font-size:2.5rem; font-weight:300; color:var(--white); margin-bottom:1rem; }

/* ══════════════════════════════════════════════════════════
   FOOTER
════════════════════════════════════════════════════════════ */
.site-footer { background:var(--bg2); border-top:1px solid var(--border); }
.footer-grid {
  display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; padding:4rem 0;
}
.footer-brand .logo { margin-bottom:1rem; }
.footer-tagline { font-size:.85rem; color:var(--muted); line-height:1.6; margin-bottom:1rem; max-width:22ch; }
.footer-email { font-size:.85rem; color:var(--gold); transition:color .2s; }
.footer-email:hover { color:var(--gold-lt); }
.footer-col { display:flex; flex-direction:column; }
.footer-col-title { font-size:.65rem; font-weight:500; letter-spacing:.15em; text-transform:uppercase; color:var(--gold); margin-bottom:1.25rem; }
.footer-link { font-size:.82rem; color:var(--muted); padding:.3rem 0; transition:color .2s; }
.footer-link:hover { color:var(--white); }
.footer-link-active { color:var(--white) !important; }
.footer-bottom { border-top:1px solid var(--border); padding:1.5rem 0; }
.footer-bottom-inner { display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:.5rem; }
.footer-copy { font-size:.75rem; color:var(--muted); }
.footer-seo { font-size:.65rem; color:rgba(136,136,153,.45); max-width:60ch; text-align:right; }

/* ══════════════════════════════════════════════════════════
   ANIMATIONS
════════════════════════════════════════════════════════════ */
@keyframes fadeUp   { from{opacity:0;transform:translateY(20px)} to{opacity:1;transform:translateY(0)} }
@keyframes pulse    { 0%,100%{opacity:1} 50%{opacity:.4} }
@keyframes scrollDown {
  0%   { transform:scaleY(0); transform-origin:top; }
  50%  { transform:scaleY(1); transform-origin:top; }
  100% { transform:scaleY(0); transform-origin:bottom; }
}

/* ══════════════════════════════════════════════════════════
   SCROLLBAR
════════════════════════════════════════════════════════════ */
::-webkit-scrollbar { width:6px; }
::-webkit-scrollbar-track { background:var(--bg2); }
::-webkit-scrollbar-thumb { background:var(--gold-dk); border-radius:3px; }

/* ══════════════════════════════════════════════════════════
   RESPONSIVE
════════════════════════════════════════════════════════════ */
@media (max-width:900px) {
  .main-nav,.header-actions { display:none; }
  .burger { display:flex; }
  .hero-inner { grid-template-columns:1fr; }
  .hero-visual { display:none; }
  .usp-grid { grid-template-columns:repeat(2,1fr); }
  .packages-grid { grid-template-columns:1fr; gap:1rem; }
  .pkg-popular { transform:translateY(0); }
  .pkg-popular:hover { transform:translateY(-4px); }
  .gallery-grid { grid-template-columns:repeat(2,1fr); }
  .gallery-wide { grid-column:span 1; }
  .faq-layout { grid-template-columns:1fr; gap:2.5rem; }
  .faq-left { position:static; }
  .contact-layout { grid-template-columns:1fr; gap:2.5rem; }
  .contact-info { position:static; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:2rem; }
  .footer-brand { grid-column:1/-1; }
}
@media (max-width:600px) {
  .usp-grid { grid-template-columns:1fr; }
  .gallery-grid { grid-template-columns:1fr; }
  .form-row { grid-template-columns:1fr; }
  .form-wrap { padding:1.5rem; }
  .footer-grid { grid-template-columns:1fr; }
  .footer-bottom-inner { flex-direction:column; align-items:flex-start; }
  .footer-seo { text-align:left; }
}

/* ══════════════════════════════════════════════════════════
   STATS
════════════════════════════════════════════════════════════ */
.stats-section {
  background: var(--bg2);
  border-top: 1px solid var(--border);
  border-bottom: 1px solid var(--border);
  padding: 2.5rem 0;
}
.stats-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  text-align: center;
}
.stat-item { display: flex; flex-direction: column; gap: .3rem; }
.stat-value {
  font-family: var(--font-d);
  font-size: clamp(2rem, 3.5vw, 3rem);
  font-weight: 300;
  color: var(--gold);
  line-height: 1;
}
.stat-label { font-size: .75rem; color: var(--muted); letter-spacing: .06em; text-transform: uppercase; }

/* ══════════════════════════════════════════════════════════
   HERO PHOTOS
════════════════════════════════════════════════════════════ */
.hero-photos { display: flex; justify-content: center; align-items: center; }
.hero-photo-grid {
  position: relative;
  width: 480px;
  height: 440px;
}
.hero-photo {
  position: absolute;
  object-fit: cover;
  border-radius: 3px;
  box-shadow: 0 8px 40px rgba(0,0,0,.6);
}
.hp-main {
  width: 320px; height: 340px;
  top: 50px; left: 0;
  transform: rotate(-2deg);
  z-index: 2;
  border: 6px solid var(--white);
}
.hp-tr {
  width: 220px; height: 180px;
  top: 0; right: 0;
  transform: rotate(3deg);
  z-index: 3;
  border: 5px solid var(--white);
}
.hp-bl {
  width: 200px; height: 240px;
  bottom: 0; right: 20px;
  transform: rotate(-5deg);
  z-index: 1;
  border: 5px solid var(--white);
  opacity: .9;
}

/* ══════════════════════════════════════════════════════════
   USP sub text
════════════════════════════════════════════════════════════ */
.usp-sub {
  font-size: .9rem;
  color: var(--muted);
  line-height: 1.7;
  max-width: 65ch;
  margin-top: .5rem;
}

/* ══════════════════════════════════════════════════════════
   PROCESS
════════════════════════════════════════════════════════════ */
.process-section { padding: var(--py) 0; background: var(--bg2); }
.process-grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1rem;
  margin-top: 2.5rem;
  position: relative;
}
.process-grid::before {
  content: '';
  position: absolute;
  top: 1.8rem;
  left: 10%;
  right: 10%;
  height: 1px;
  background: var(--border2);
  z-index: 0;
}
.process-step {
  display: flex; flex-direction: column; align-items: center; text-align: center;
  gap: .75rem; position: relative; z-index: 1;
}
.process-num {
  width: 3.5rem; height: 3.5rem;
  border-radius: 50%;
  border: 1px solid var(--gold-dk);
  background: var(--bg2);
  display: flex; align-items: center; justify-content: center;
  font-family: var(--font-d);
  font-size: 1.2rem;
  color: var(--gold);
}
.process-title { font-size: .85rem; font-weight: 500; color: var(--white); }
.process-desc  { font-size: .78rem; color: var(--muted); line-height: 1.5; }

/* ══════════════════════════════════════════════════════════
   PHOTOS GRID
════════════════════════════════════════════════════════════ */
.photos-section { padding: var(--py) 0; background: var(--bg); }
.photos-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px;
  margin-top: 1.5rem;
}
.photos-grid img {
  width: 100%; aspect-ratio: 4/3;
  object-fit: cover;
  border-radius: 3px;
  transition: transform .4s var(--ease);
}
.photos-grid img:hover { transform: scale(1.03); }

/* ══════════════════════════════════════════════════════════
   PACKAGE TAG (no price)
════════════════════════════════════════════════════════════ */
.pkg-tag {
  font-size: .75rem;
  color: var(--muted);
  margin-top: .25rem;
}

/* ══════════════════════════════════════════════════════════
   REVIEWS
════════════════════════════════════════════════════════════ */
.reviews-section { padding: var(--py) 0; background: var(--bg2); }
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
  margin-top: 2.5rem;
}
.review-card {
  background: var(--bg-card);
  border: 1px solid var(--border);
  border-radius: 4px;
  padding: 1.75rem;
  display: flex;
  flex-direction: column;
  gap: .75rem;
  transition: border-color .3s, transform .3s;
}
.review-card:hover { border-color: var(--border2); transform: translateY(-3px); }
.review-stars { color: var(--gold); font-size: .9rem; letter-spacing: .1em; }
.review-text { font-size: .84rem; color: var(--muted); line-height: 1.7; font-style: italic; flex: 1; }
.review-name { font-size: .72rem; font-weight: 500; color: var(--gold); letter-spacing: .08em; text-transform: uppercase; }

/* ══════════════════════════════════════════════════════════
   RESPONSIVE ADDITIONS
════════════════════════════════════════════════════════════ */
@media (max-width: 900px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .process-grid { grid-template-columns: repeat(2, 1fr); }
  .process-grid::before { display: none; }
  .photos-grid { grid-template-columns: repeat(2, 1fr); }
  .reviews-grid { grid-template-columns: 1fr; }
  .hero-photos { display: none; }
}
@media (max-width: 600px) {
  .stats-grid { grid-template-columns: repeat(2, 1fr); gap: .75rem; }
  .process-grid { grid-template-columns: 1fr; }
  .photos-grid { grid-template-columns: repeat(2, 1fr); }
}

/* 3-column footer */
.footer-grid-3 { grid-template-columns: 2fr 1fr 1fr; }
@media (max-width: 900px) { .footer-grid-3 { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .footer-grid-3 { grid-template-columns: 1fr; } }
