/* Azzeman landing — brand green #0E8040, brand gold #7A6960 */

/* ==========================================================================
   AZZEMAN — "Time, the Ethiopian way"
   Colour:  woven tibeb borders — saffron (Meskel daisy), highland green,
            tibeb red, lapis — on warm white, with coffee for ink.
   Type:    Unbounded (wide, confident) · Instrument Sans (reading)
            Noto Sans Ethiopic (Ge'ez) · Caveat (postcards only)
   Motion:  one signature object (the 13-month dial), then play:
            boarding pass, sky slider, elevator, breathing orb, flap board.
   ========================================================================== */
:root{
  --white:#FFFDF9;
  --paper:#FFFFFF;
  --mist:#EEF3F5;
  --wash:#E8F5EE;
  --ink:#24160F;
  --ink-2:#5B4A40;
  --ink-3:#7C6B61;
  --line:#D7E8DE;
  --saffron:#7A6960;
  --saffron-deep:#5E524A;
  --green:#0E8040;
  --green-2:#12A04F;
  --green-deep:#0A5C2E;
  --red:#D23C2A;
  --blue:#2356A8;
  --sky:#A9D0F0;
  --coffee:#3A2418;

  --display:"Unbounded", "Arial Black", system-ui, sans-serif;
  --sans:"Instrument Sans", ui-sans-serif, -apple-system, "Segoe UI", system-ui, sans-serif;
  --geez:"Noto Sans Ethiopic", "Nyala", "Abyssinica SIL", sans-serif;
  --hand:"Caveat", "Segoe Print", cursive;

  --shell:1280px;
  --gutter:clamp(20px, 4.5vw, 64px);
  --ease:cubic-bezier(.2,.75,.25,1);
  --spring:cubic-bezier(.34,1.45,.5,1);

  --tibeb:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='32' viewBox='0 0 96 32'%3E%3Cpath d='M0 5 L6 1 L12 5 L18 1 L24 5 L30 1 L36 5 L42 1 L48 5 L54 1 L60 5 L66 1 L72 5 L78 1 L84 5 L90 1 L96 5' fill='none' stroke='%23D23C2A' stroke-width='2'/%3E%3Cpath d='M12 8 L20 16 L12 24 L4 16Z' fill='%230E8040'/%3E%3Cpath d='M12 12 L16 16 L12 20 L8 16Z' fill='%237A6960'/%3E%3Crect x='34' y='10' width='4' height='12' fill='%232356A8'/%3E%3Crect x='30' y='14' width='12' height='4' fill='%232356A8'/%3E%3Cpath d='M60 8 L68 16 L60 24 L52 16Z' fill='%23D23C2A'/%3E%3Cpath d='M60 12 L64 16 L60 20 L56 16Z' fill='%23FFFDF9'/%3E%3Crect x='82' y='10' width='4' height='12' fill='%230E8040'/%3E%3Crect x='78' y='14' width='12' height='4' fill='%237A6960'/%3E%3Cpath d='M0 27 L6 31 L12 27 L18 31 L24 27 L30 31 L36 27 L42 31 L48 27 L54 31 L60 27 L66 31 L72 27 L78 31 L84 27 L90 31 L96 27' fill='none' stroke='%232356A8' stroke-width='2'/%3E%3C/svg%3E");
}

*,*::before,*::after{ box-sizing:border-box; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body.azzeman-landing{
  margin:0; background:var(--white); color:var(--ink);
  font-family:var(--sans); font-size:clamp(16px, .3vw + 15px, 17.5px); line-height:1.6;
  -webkit-font-smoothing:antialiased;
  /* do NOT set overflow-x:clip/hidden here — it creates a scrollport and kills sticky brand-moment */
}
img{ display:block; max-width:100%; }
a{ color:inherit; }
button, input, select{ font:inherit; color:inherit; }
:focus-visible{ outline:3px solid var(--blue); outline-offset:3px; border-radius:6px; }
::selection{ background:var(--saffron); color:var(--ink); }

h1,h2,h3{ font-family:var(--display); font-weight:600; letter-spacing:-.035em; line-height:1; margin:0; text-wrap:balance; }
h1{ font-size:clamp(2.3rem, 4.6vw, 4.5rem); letter-spacing:-.045em; }
h2{ font-size:clamp(1.8rem, 3.4vw, 3.3rem); }
h3{ font-size:clamp(1.2rem, 1.6vw, 1.55rem); letter-spacing:-.02em; line-height:1.15; }
h4{ font-size:1rem; font-weight:600; margin:0; }
p{ margin:0 0 1em; max-width:60ch; }
p:last-child{ margin-bottom:0; }
.lead{ font-size:clamp(1.06rem, 1.15vw, 1.22rem); color:var(--ink-2); max-width:48ch; line-height:1.55; }
.muted{ color:var(--ink-3); }
.small{ font-size:.9rem; }
.geez{ font-family:var(--geez); }

.shell{ width:min(100% - var(--gutter) * 2, var(--shell)); margin-inline:auto; }
.band{ padding-block:clamp(84px, 11vw, 160px); }
.sr{ position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }
.skip{ position:absolute; left:12px; top:-60px; z-index:1000; background:var(--paper); padding:10px 16px; border-radius:8px; }
.skip:focus{ top:12px; }

.tag{ display:inline-flex; align-items:center; gap:10px; font-size:.92rem; font-weight:600; color:var(--green); margin:0 0 20px; }
.tag::before{ content:""; width:34px; height:12px; background:var(--tibeb) 0 50% / auto 12px repeat-x; border-radius:2px; }
.tag.light{ color:var(--saffron); }

.tibeb-band{ height:32px; background:var(--tibeb) 0 0 / 96px 32px repeat-x; animation:weave 30s linear infinite; }
@keyframes weave{ to{ background-position:-960px 0; } }

/* buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:15px 26px; border-radius:999px; border:2px solid transparent;
  font-weight:600; font-size:1rem; text-decoration:none; cursor:pointer; white-space:nowrap;
  transition:transform .35s var(--spring), box-shadow .35s ease, background .25s, color .25s;
}
.btn:hover{ transform:translateY(-3px); }
.btn:active{ transform:translateY(0); }
.btn-sun{ background:var(--green); color:#fff; box-shadow:0 8px 0 var(--green-deep); }
.btn-sun:hover{ box-shadow:0 11px 0 var(--green-deep); }
.btn-sun:active{ box-shadow:0 4px 0 var(--green-deep); transform:translateY(4px); }
.btn-green{ background:var(--green); color:#fff; box-shadow:0 8px 0 var(--green-deep); }
.btn-green:hover{ box-shadow:0 11px 0 var(--green-deep); }
.btn-line{ border-color:var(--ink); color:var(--ink); background:transparent; }
.btn-line:hover{ background:var(--ink); color:var(--white); }
.btn-light{ border-color:rgba(255,255,255,.7); color:#fff; }
.btn-light:hover{ background:#fff; color:var(--ink); }
.btn svg{ transition:transform .35s var(--ease); }
.btn:hover svg.go{ transform:translateX(3px); }

.frame{ position:relative; overflow:hidden; background:var(--mist); }
.frame img{ width:100%; height:100%; object-fit:cover; }

/* reveal */
/* Reveal: visible by default; motion enhances when JS adds .in */
.rv{ opacity:1; transform:none; }
.pop{ opacity:1; transform:rotate(var(--r, 0deg)); }
@media (prefers-reduced-motion: no-preference){
  .rv{ opacity:0; transform:translateY(34px); transition:opacity .9s var(--ease), transform .9s var(--ease); transition-delay:var(--d, 0s); }
  .rv.in{ opacity:1; transform:none; }
  .pop{ opacity:0; transform:scale(.9) rotate(var(--r, 0deg)); transition:opacity .7s var(--ease), transform .9s var(--spring); transition-delay:var(--d, 0s); }
  .pop.in{ opacity:1; transform:rotate(var(--r, 0deg)); }
}

.hero h1 .ln{ display:block; overflow:hidden; padding-bottom:.06em; }
.hero h1 .ln > span{ display:block; transform:none; }
@media (prefers-reduced-motion: no-preference){
  .hero h1 .ln > span{ transform:translateY(105%); animation:up 1s var(--ease) forwards; }
  .hero h1 .ln:nth-child(2) > span{ animation-delay:.1s; }
  .hero h1 .ln:nth-child(3) > span{ animation-delay:.2s; }
  .hero h1 .ln:nth-child(4) > span{ animation-delay:.3s; }
}
.hero h1 .hl{ background:linear-gradient(transparent 62%, rgba(14,128,64,.28) 62%, rgba(14,128,64,.28) 92%, transparent 92%); padding:0 .06em; }
.hero .lead{ margin:26px 0 34px; }
.hero-cta{ display:flex; flex-wrap:wrap; gap:14px; }
.stars{ display:flex; align-items:center; gap:10px; margin-top:34px; font-size:.9rem; color:var(--ink-3); }
@media (prefers-reduced-motion: no-preference){
  .hero .lead{ opacity:0; animation:fadein .9s ease .5s forwards; }
  .hero-cta{ opacity:0; animation:fadein .9s ease .65s forwards; }
  .stars{ opacity:0; animation:fadein .9s ease .8s forwards; }
}
@keyframes up{ to{ transform:none; } }
@keyframes fadein{ to{ opacity:1; } }
@keyframes dial-in{ to{ opacity:1; transform:none; } }

/* ---------------- NAV ---------------- */
.nav{ position:fixed; top:14px; left:0; right:0; z-index:200; display:flex; justify-content:center; pointer-events:none; }
.nav-in{
  pointer-events:auto; width:min(100% - 28px, 1240px); display:flex; align-items:center; gap:18px;
  padding:9px 9px 9px 22px; border-radius:999px; background:rgba(255,253,249,.72);
  -webkit-backdrop-filter:blur(18px) saturate(1.4); backdrop-filter:blur(18px) saturate(1.4);
  border:1px solid rgba(232,223,211,.9); box-shadow:0 10px 40px rgba(36,22,15,.06);
  transition:box-shadow .4s, background .4s;
}
.nav.scrolled .nav-in{ background:rgba(255,253,249,.92); box-shadow:0 12px 40px rgba(36,22,15,.1); }
.brand{ display:flex; align-items:center; gap:10px; text-decoration:none; margin-right:auto; }
.brand-mark{ width:34px; height:34px; flex:none; }
.brand b{ font-family:var(--display); font-weight:600; font-size:1.15rem; letter-spacing:-.03em; }
.brand small{ display:block; white-space:nowrap; font-size:.68rem; color:var(--ink-3); margin-top:1px; letter-spacing:.02em; }
.links{ display:flex; list-style:none; margin:0; padding:0; gap:2px; }
.links a{ display:block; white-space:nowrap; padding:9px 11px; border-radius:999px; text-decoration:none; font-size:.93rem; font-weight:500; color:var(--ink-2); transition:background .2s, color .2s; }
.links a:hover{ background:var(--wash); color:var(--ink); }
.nav-clock{ display:flex; flex-direction:column; align-items:flex-end; line-height:1.15; font-size:.78rem; color:var(--ink-3); font-variant-numeric:tabular-nums; white-space:nowrap; }
.nav-clock b{ color:var(--ink); font-weight:600; font-size:.86rem; }
.nav .btn{ padding:12px 22px; box-shadow:0 5px 0 var(--green-deep); }
.burger{ display:none; width:46px; height:46px; border-radius:50%; border:0; background:var(--ink); color:#fff; cursor:pointer; place-items:center; }

/* ---------------- HERO ---------------- */
.hero{ position:relative; isolation:isolate; min-height:100svh; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:clamp(20px,4vw,60px); padding-top:clamp(120px,14vh,150px); padding-bottom:clamp(60px,8vh,90px); }
.hero::before{
  content:""; position:absolute; z-index:-1; width:min(1000px, 110vw); aspect-ratio:1; right:calc((100% - 100vw) / 2 + 20px); top:50%; transform:translateY(-50%);
  background:radial-gradient(closest-side, rgba(14,128,64,.38), rgba(14,128,64,.12) 55%, rgba(14,128,64,0));
}
.welcome{ display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 14px; margin-bottom:24px; }
.welcome .geez{ font-size:clamp(1.5rem, 2.4vw, 2.1rem); font-weight:600; color:var(--green); }
.welcome span:last-child{ font-size:.95rem; color:var(--ink-3); }
.hero .lead{ margin:26px 0 34px; }
.stars i{ display:flex; gap:3px; color:var(--green); }

/* the 13-month dial — entrance + continuous ring spin (matches azzeman-hotel.html) */
.dial-wrap{ position:relative; width:min(100%, 580px); aspect-ratio:1; margin-inline:auto; }
@media (prefers-reduced-motion: no-preference){
  .dial-wrap{ opacity:0; transform:scale(.92) rotate(-8deg); animation:dial-in 1.4s var(--spring) .2s forwards; }
}
.dial{ width:100%; height:100%; overflow:visible; }
.dial .ring{ transform-origin:200px 200px; transform-box:fill-box; animation:turn 180s linear infinite; }
@keyframes turn{ to{ transform:rotate(360deg); } }
.dial .seg{ transition:opacity .3s; }
.dial .mlabel{ font:600 7.4px var(--sans); fill:var(--ink-2); letter-spacing:.06em; }
.dial .mlabel.now{ fill:var(--ink); font-size:8.4px; }
.dial .photo{ transition:opacity 1.4s ease; }
.dial .tick{ stroke:var(--ink); stroke-width:1; opacity:.18; }
.dial .tick.major{ opacity:.5; stroke-width:1.6; }
.dial .hand{ transform-origin:200px 200px; transition:transform 1s var(--spring); }
.chip{
  position:absolute; z-index:2; display:flex; flex-direction:column; gap:1px; padding:11px 16px; border-radius:18px;
  background:var(--paper); box-shadow:0 14px 40px rgba(36,22,15,.12); border:1px solid var(--line);
  font-size:.78rem; color:var(--ink-3); line-height:1.25; animation:bob 7s ease-in-out infinite alternate;
}
.chip b{ font-family:var(--display); font-weight:600; font-size:1.05rem; color:var(--ink); letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.chip.c1{ left:-4%; top:14%; }
.chip.c2{ right:-6%; top:40%; animation-delay:-2.5s; background:var(--green); border-color:var(--green); color:rgba(255,255,255,.75); }
.chip.c2 b{ color:#fff; }
.chip.c3{ left:6%; bottom:6%; animation-delay:-4.5s; background:var(--saffron); border-color:var(--saffron); color:#fff; }
@keyframes bob{ from{ translate:0 0; } to{ translate:0 -12px; } }

/* ---------------- BOARDING PASS ---------------- */
.pass-sec{ position:relative; }
.pass{
  position:relative; display:grid; grid-template-columns:minmax(0,1fr) 300px; background:var(--paper);
  border-radius:28px; box-shadow:0 30px 80px rgba(36,22,15,.12), 0 2px 0 var(--line); overflow:visible;
}
.pass-main{ padding:clamp(24px,3vw,40px); border-right:2px dashed var(--line); position:relative; }
.pass-main::before, .pass-main::after{ content:""; position:absolute; right:-17px; width:32px; height:32px; border-radius:50%; background:var(--white); }
.pass-main::before{ top:-16px; box-shadow:inset 0 -6px 10px -6px rgba(36,22,15,.1); }
.pass-main::after{ bottom:-16px; box-shadow:inset 0 6px 10px -6px rgba(36,22,15,.1); }
.pass-top{ display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:26px; padding-bottom:18px; border-bottom:1px solid var(--line); }
.pass-top .t{ font-family:var(--display); font-weight:600; font-size:.95rem; letter-spacing:.04em; }
.pass-top .cls{ font-size:.8rem; font-weight:600; background:var(--wash); color:var(--saffron-deep); padding:6px 12px; border-radius:999px; }
.route-row{ display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:20px; margin-bottom:28px; }
.code{ font-family:var(--display); font-weight:700; font-size:clamp(2.4rem, 5vw, 4rem); letter-spacing:-.04em; line-height:.9; }
.code small{ display:block; font-family:var(--sans); font-size:.8rem; font-weight:500; color:var(--ink-3); letter-spacing:0; margin-top:8px; }
.code.right{ text-align:right; }
.flight{ position:relative; height:2px; background:repeating-linear-gradient(90deg, var(--ink-3) 0 6px, transparent 6px 12px); }
.flight .plane{ position:absolute; top:50%; left:0; transform:translate(-50%,-50%); width:34px; height:34px; border-radius:50%; background:var(--green); color:#fff; display:grid; place-items:center; animation:fly 5s var(--ease) infinite; }
@keyframes fly{ 0%{ left:0; } 70%,100%{ left:100%; } }
.flight span{ position:absolute; left:50%; top:14px; transform:translateX(-50%); font-size:.78rem; color:var(--ink-3); white-space:nowrap; }
.fields{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:14px; }
.fld{ display:flex; flex-direction:column; gap:4px; padding:12px 14px; border-radius:14px; background:var(--mist); border:2px solid transparent; transition:border-color .2s, background .2s; }
.fld:focus-within{ border-color:var(--blue); background:#fff; }
.fld label, .fld-kicker{ font-size:.74rem; font-weight:600; color:var(--ink-3); letter-spacing:.04em; }
.fld input, .fld select{ border:0; background:transparent; padding:0; font-weight:600; font-size:1rem; width:100%; appearance:none; -webkit-appearance:none; cursor:pointer; }
.fld input:focus, .fld select:focus{ outline:none; }
.fld-guests{ grid-column: span 2; gap:10px; }
.guest-pair{ display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.guest-step{ display:flex; flex-direction:column; gap:8px; padding:10px 12px; border-radius:12px; background:#fff; border:1px solid rgba(14,128,64,.12); box-shadow:0 1px 0 rgba(14,128,64,.04); }
.guest-label{ font-size:.72rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-3); }
.stepper{ display:inline-flex; align-items:center; width:100%; height:42px; border-radius:999px; border:1.5px solid rgba(14,128,64,.18); background:linear-gradient(180deg,#fff,#f7fbf8); overflow:hidden; }
.step-btn{ flex:0 0 42px; height:100%; border:0; background:transparent; color:var(--green); font-size:1.25rem; font-weight:600; cursor:pointer; transition:background .15s, color .15s; }
.step-btn:hover{ background:rgba(14,128,64,.08); }
.step-btn:disabled{ color:#b7c3bb; cursor:not-allowed; background:transparent; }
.stepper strong{ flex:1; text-align:center; font-size:1.05rem; font-weight:700; color:var(--ink); font-variant-numeric:tabular-nums; }
.guest-cap{ font-size:.78rem; color:var(--ink-3); min-height:1.2em; }
.pass-stub{ padding:clamp(24px,3vw,36px); display:flex; flex-direction:column; justify-content:space-between; gap:18px; background:linear-gradient(180deg, var(--wash), #F4FBF7); border-radius:0 28px 28px 0; }
.stub-row{ display:flex; justify-content:space-between; gap:10px; font-size:.82rem; color:var(--ink-3); }
.stub-row b{ display:block; color:var(--ink); font-size:1rem; }
.barcode{ height:62px; background:repeating-linear-gradient(90deg, var(--ink) 0 2px, transparent 2px 4px, var(--ink) 4px 5px, transparent 5px 8px, var(--ink) 8px 11px, transparent 11px 13px); border-radius:4px; opacity:.85; }
.pass .btn{ width:100%; }
.pass-err{ font-size:.86rem; color:var(--red); min-height:1.3em; margin:0; }
.perks{ display:flex; flex-wrap:wrap; gap:10px 26px; margin-top:26px; font-size:.93rem; color:var(--ink-2); }
.perks span{ display:inline-flex; gap:8px; align-items:center; }
.perks svg{ color:var(--green); }

/* floating mini booking pill */
.pill-book{
  position:fixed; left:20px; bottom:20px; z-index:180; transform:translateY(160%);
  display:flex; align-items:center; gap:14px; padding:8px 8px 8px 22px; border-radius:999px;
  background:var(--ink); color:#fff; box-shadow:0 20px 50px rgba(36,22,15,.3); transition:transform .6s var(--spring);
  font-size:.92rem;
}
.pill-book.show{ transform:none; }
.pill-book .btn{ padding:11px 20px; box-shadow:none; }

/* ---------------- STORY ---------------- */
.story{ display:grid; grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr); gap:clamp(30px,6vw,100px); align-items:center; }
.fill{ font-family:var(--display); font-weight:500; font-size:clamp(1.35rem, 2.3vw, 2.2rem); line-height:1.2; letter-spacing:-.03em; margin:0; max-width:none; }
.fill .w{ opacity:.14; transition:opacity .3s linear; }
.fill .w.lit{ opacity:1; }
.stack{ position:relative; aspect-ratio:4/5; }
.stack .frame{ position:absolute; border-radius:24px; box-shadow:0 30px 60px rgba(36,22,15,.18); border:6px solid #fff; }
.stack .f1{ inset:0 18% 22% 0; --r:-4deg; }
.stack .f2{ inset:30% 0 0 26%; --r:5deg; }
.stack .badge{ position:absolute; left:-6%; bottom:6%; z-index:2; width:132px; height:132px; border-radius:50%; background:var(--green); color:#fff; display:grid; place-items:center; text-align:center; font-family:var(--display); font-size:.78rem; line-height:1.2; box-shadow:0 20px 40px rgba(22,98,74,.35); animation:turn 40s linear infinite; }
.stack .badge span{ display:block; font-size:2.1rem; letter-spacing:-.04em; }
.feats{ display:grid; grid-template-columns:repeat(3, minmax(0,1fr)); gap:18px; margin-top:clamp(56px,7vw,100px); }
.feat{ padding:28px; border-radius:24px; background:var(--mist); position:relative; overflow:hidden; transition:transform .5s var(--spring); }
.feat:hover{ transform:translateY(-6px) rotate(-.6deg); }
.feat:nth-child(2){ background:var(--wash); }
.feat:nth-child(3){ background:#FCE6E2; }
.feat .ic{ width:52px; height:52px; border-radius:16px; display:grid; place-items:center; background:#fff; margin-bottom:20px; color:var(--green); }
.feat h3{ margin-bottom:10px; }
.feat p{ color:var(--ink-2); font-size:.96rem; }
.amen{ margin-top:18px; display:flex; flex-wrap:wrap; gap:8px; }
.amen span{ padding:8px 15px; border-radius:999px; background:#fff; border:1px solid var(--line); font-size:.88rem; color:var(--ink-2); transition:background .2s, transform .3s var(--spring); }
.amen span:hover{ background:var(--wash); transform:translateY(-2px); }

/* ---------------- SKY SLIDER (a day at Azzeman) ---------------- */
.sky{ position:relative; overflow:hidden; color:var(--ink); transition:background 1.2s ease, color .8s ease; isolation:isolate; }
.sky[data-phase="dawn"]{ background:linear-gradient(180deg, #B8DFC8 0%, #E8F5EE 60%, var(--white) 100%); }
.sky[data-phase="day"]{ background:linear-gradient(180deg, #9CCBF0 0%, #DDEEFA 60%, var(--white) 100%); }
.sky[data-phase="dusk"]{ background:linear-gradient(180deg, #3D7A5C 0%, #A8D4BC 60%, #E8F5EE 100%); }
.sky[data-phase="night"]{ background:linear-gradient(180deg, #0F1E45 0%, #1D2F63 60%, #2A3B72 100%); color:#fff; }
.sky[data-phase="night"] .lead, .sky[data-phase="night"] .muted{ color:rgba(255,255,255,.75); }
.sky[data-phase="night"] .tag{ color:var(--saffron); }
.sky-head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:24px; }
.arc{ position:relative; height:clamp(150px, 20vw, 230px); margin-top:clamp(20px,3vw,40px); }
.arc svg{ position:absolute; inset:0; width:100%; height:100%; overflow:visible; }
.arc .path{ fill:none; stroke:currentColor; stroke-opacity:.25; stroke-width:2; stroke-dasharray:3 7; }
.orb{ position:absolute; left:0; top:0; width:64px; height:64px; margin:-32px 0 0 -32px; border-radius:50%; background:radial-gradient(circle at 35% 35%, #B8E6C8, var(--green) 60%, var(--green-deep)); box-shadow:0 0 0 12px rgba(14,128,64,.2), 0 0 60px rgba(14,128,64,.45); transition:left .8s var(--spring), top .8s var(--spring), background .8s, box-shadow .8s; }
.sky[data-phase="night"] .orb{ background:radial-gradient(circle at 35% 35%, #fff, #E7ECF8 60%, #BFC9E6); box-shadow:0 0 0 12px rgba(255,255,255,.08), 0 0 50px rgba(255,255,255,.45); }
.arc svg.skyline{ inset:auto 0 0 0; height:44px; color:currentColor; opacity:.16; }
.hours{ display:flex; justify-content:space-between; gap:6px; margin-top:18px; }
.hour{ flex:1; border:0; background:rgba(255,255,255,.5); border-radius:16px; padding:12px 8px; cursor:pointer; text-align:center; transition:background .3s, transform .4s var(--spring), color .3s; color:inherit; }
.sky[data-phase="night"] .hour{ background:rgba(255,255,255,.08); }
.hour b{ display:block; font-family:var(--display); font-weight:600; font-size:1.02rem; letter-spacing:-.02em; font-variant-numeric:tabular-nums; }
.hour small{ font-size:.74rem; opacity:.72; }
.hour:hover{ transform:translateY(-3px); }
.hour[aria-selected="true"]{ background:var(--ink); color:#fff; }
.sky[data-phase="night"] .hour[aria-selected="true"]{ background:var(--green); color:#fff; }
.moment{ display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); gap:clamp(24px,4vw,64px); align-items:center; margin-top:clamp(36px,5vw,56px); }
.moment .frame{ aspect-ratio:16/10; border-radius:28px; box-shadow:0 30px 70px rgba(36,22,15,.18); }
.moment .frame img{ transition:opacity .45s ease, transform 1.2s var(--ease); }
.moment.swap .frame img{ opacity:0; transform:scale(1.04); }
.moment .txt{ transition:opacity .4s ease, transform .5s var(--ease); }
.moment.swap .txt{ opacity:0; transform:translateY(12px); }
.clocks{ display:flex; gap:12px; flex-wrap:wrap; margin-bottom:22px; }
.clocks span{ padding:8px 14px; border-radius:999px; background:rgba(255,255,255,.6); font-size:.84rem; font-weight:500; }
.sky[data-phase="night"] .clocks span{ background:rgba(255,255,255,.12); }
.clocks b{ font-variant-numeric:tabular-nums; }
.moment h3{ font-size:clamp(1.6rem, 2.6vw, 2.4rem); margin-bottom:14px; }
.ethtime-note{ margin-top:22px; font-size:.9rem; }

/* ---------------- ROOMS: ELEVATOR ---------------- */
.lift{ display:grid; grid-template-columns:280px minmax(0,1fr); gap:clamp(20px,3vw,40px); align-items:stretch; }
.panel{ background:var(--coffee); color:#F5E9DA; border-radius:28px; padding:26px 22px; display:flex; flex-direction:column; gap:18px; box-shadow:inset 0 2px 0 rgba(255,255,255,.08), 0 30px 60px rgba(36,22,15,.2); }
.led{ background:#140B07; border-radius:14px; padding:16px; font-family:var(--display); color:#7DFFB0; text-shadow:0 0 12px rgba(14,128,64,.7); min-height:88px; display:flex; flex-direction:column; justify-content:center; }
.led small{ font-family:var(--sans); font-size:.72rem; color:rgba(125,255,176,.55); text-shadow:none; letter-spacing:.08em; }
.led b{ font-weight:600; font-size:1.2rem; letter-spacing:-.02em; margin-top:4px; }
.lift-btns{ display:grid; gap:10px; }
.lbtn{ display:flex; align-items:center; gap:14px; width:100%; text-align:left; border:0; background:transparent; color:inherit; padding:6px; border-radius:999px; cursor:pointer; font-weight:500; transition:background .2s; }
.lbtn:hover{ background:rgba(255,255,255,.06); }
.lbtn i{ width:46px; height:46px; flex:none; border-radius:50%; display:grid; place-items:center; font-style:normal; font-family:var(--display); font-size:.8rem; font-weight:600; background:linear-gradient(145deg, #5B3E2D, #2A1810); border:2px solid #7A5A45; box-shadow:0 3px 0 #140B07; transition:box-shadow .2s, background .3s, color .3s, transform .15s; }
.lbtn:active i{ transform:translateY(2px); box-shadow:0 1px 0 #140B07; }
.lbtn[aria-pressed="true"] i{ background:var(--green); color:#fff; border-color:var(--green-2); box-shadow:0 0 18px rgba(14,128,64,.7), 0 3px 0 var(--green-deep); }
.panel .note{ font-size:.78rem; color:rgba(245,233,218,.55); margin-top:auto; }
.car{ position:relative; border-radius:28px; overflow:hidden; min-height:min(72svh, 640px); background:var(--coffee); isolation:isolate; }
.car > .frame{ position:absolute; inset:0; }
.car > .frame img{ transition:transform 1.6s var(--ease); }
.car.open > .frame img{ transform:scale(1.03); }
.door{ position:absolute; top:0; bottom:0; width:50%; z-index:3; background:linear-gradient(90deg, #B8AFA6, #E7E1DA 45%, #CFC7BF 55%, #9E958C); transition:transform .75s cubic-bezier(.7,0,.25,1); box-shadow:inset 0 0 40px rgba(0,0,0,.18); }
.door::after{ content:""; position:absolute; top:0; bottom:0; width:3px; background:rgba(0,0,0,.25); }
.door.l{ left:0; } .door.l::after{ right:0; }
.door.r{ right:0; } .door.r::after{ left:0; }
.car.open .door.l{ transform:translateX(-101%); }
.car.open .door.r{ transform:translateX(101%); }
.car::after{ content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(0deg, rgba(20,11,7,.85) 0%, rgba(20,11,7,.1) 55%); }
.room-info{ position:absolute; z-index:2; left:clamp(22px,3vw,40px); right:clamp(22px,3vw,40px); bottom:clamp(22px,3vw,36px); color:#fff; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:20px; }
.room-info h3{ font-size:clamp(1.8rem, 3.4vw, 3rem); margin-bottom:10px; }
.room-info p{ color:rgba(255,255,255,.85); max-width:44ch; margin:0; }
.room-info .chips{ display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; }
.room-info .chips span{ font-size:.8rem; padding:6px 12px; border-radius:999px; background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.25); }

/* ---------------- BRAND MOMENT ---------------- */
.brand-moment{ height:200vh; position:relative; }
.bm-stage{ position:sticky; top:0; height:100svh; display:grid; place-items:center; overflow:hidden; background:var(--white); }
.bm-word{ display:flex; font-family:var(--display); font-weight:700; font-size:clamp(2.6rem, 12vw, 12rem); letter-spacing:-.05em; line-height:.85; }
.bm-word span{
  display:block; color:transparent; -webkit-background-clip:text; background-clip:text;
  background-image:var(--tibeb), linear-gradient(var(--ink), var(--ink));
  background-size:calc(96px * var(--z, 3)) calc(32px * var(--z, 3)), 100% 100%;
  background-position:calc(var(--bp, 0) * -300px + var(--i) * 40px) 50%, 0 0;
  transform:translateY(calc((1 - var(--bp, 0)) * (80px + var(--i) * 18px))) rotate(calc((1 - var(--bp, 0)) * (var(--i) - 3) * 4deg));
  opacity:calc(.1 + var(--bp, 0) * .9);
}
.bm-geez{ position:absolute; top:22%; font-family:var(--geez); font-size:clamp(1.2rem, 2.4vw, 2rem); color:var(--green); opacity:var(--bp, 0); }
.bm-cap{ position:absolute; bottom:18%; font-size:1rem; color:var(--ink-2); opacity:var(--bp, 0); text-align:center; padding-inline:20px; }

/* ---------------- SPA ---------------- */
.spa{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(30px,6vw,96px); align-items:center; }
.breath{ position:relative; aspect-ratio:1; display:grid; place-items:center; }
.breath .ph{ position:absolute; border-radius:50%; overflow:hidden; width:40%; aspect-ratio:1; box-shadow:0 20px 50px rgba(36,22,15,.2); border:5px solid #fff; }
.breath .ph img{ width:100%; height:100%; object-fit:cover; }
.breath .p1{ left:0; top:4%; width:34%; }
.breath .p2{ right:0; top:0; width:30%; }
.breath .p3{ left:4%; bottom:0; width:28%; }
.breath .p4{ right:4%; bottom:6%; width:36%; }
.orb-btn{
  position:relative; z-index:2; width:46%; aspect-ratio:1; border-radius:50%; border:0; cursor:pointer;
  background:radial-gradient(circle at 35% 30%, #E8F4EE, #9FD0BB 55%, var(--green-2)); color:var(--ink);
  box-shadow:0 0 0 18px rgba(30,122,93,.1), 0 0 0 36px rgba(30,122,93,.06), 0 30px 60px rgba(22,98,74,.3);
  display:grid; place-items:center; text-align:center; font-family:var(--display); font-weight:600; font-size:clamp(.95rem,1.4vw,1.2rem);
  transition:transform 4s ease-in-out, box-shadow 4s ease-in-out;
}
.orb-btn small{ display:block; font-family:var(--sans); font-weight:500; font-size:.78rem; margin-top:4px; opacity:.75; }
.orb-btn.in{ transform:scale(1.32); }
.orb-btn.idle{ animation:breathe-idle 5s ease-in-out infinite; }
@keyframes breathe-idle{ 50%{ transform:scale(1.05); } }
.spec{ list-style:none; margin:26px 0 30px; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.spec li{ padding:16px 18px; border-radius:18px; background:var(--mist); }
.spec b{ display:block; font-weight:600; }
.spec span{ font-size:.9rem; color:var(--ink-3); }

/* ---------------- MEETINGS: MAP ---------------- */
.meet{ background:var(--green); color:#fff; border-radius:clamp(28px,4vw,48px); padding:clamp(34px,6vw,90px) clamp(22px,5vw,80px); position:relative; overflow:hidden; }
.meet h2{ color:#fff; }
.meet .lead{ color:rgba(255,255,255,.82); }
.meet-grid{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:clamp(24px,5vw,72px); align-items:center; margin-top:clamp(30px,4vw,56px); }
.eth-map{ position:relative; }
.eth-map svg{ width:100%; height:auto; display:block; overflow:visible; }
.eth-map .land{ fill:rgba(255,255,255,.1); stroke:rgba(255,255,255,.55); stroke-width:1.2; stroke-linejoin:round; }
.eth-map .contour{ fill:none; stroke:rgba(255,255,255,.12); stroke-width:.8; }
.mpin{ cursor:pointer; }
.mpin circle.halo{ fill:rgba(14,128,64,.3); transform-box:fill-box; transform-origin:center; animation:halo 2.4s ease-out infinite; }
@keyframes halo{ from{ transform:scale(.6); opacity:1; } to{ transform:scale(2.2); opacity:0; } }
.mpin circle.dot{ fill:var(--saffron); stroke:#fff; stroke-width:1.6; transition:r .3s; }
.mpin text{ fill:#fff; font:600 8.5px var(--sans); }
.mpin.on circle.dot{ fill:#fff; stroke:#fff; }
.addis{ fill:#fff; }
.map-note{ font-size:.76rem; color:rgba(255,255,255,.5); margin-top:6px; }
.hall-card{ background:#fff; color:var(--ink); border-radius:28px; overflow:hidden; box-shadow:0 30px 70px rgba(0,0,0,.25); }
.hall-card .frame{ aspect-ratio:16/10; }
.hall-card .frame img{ transition:opacity .4s ease, transform 1s var(--ease); }
.hall-card.swap .frame img{ opacity:0; transform:scale(1.05); }
.hall-card .body{ padding:24px 26px 26px; }
.hall-card .where{ font-size:.82rem; font-weight:600; color:var(--green); margin-bottom:6px; }
.hall-card h3{ font-size:clamp(1.5rem, 2.4vw, 2.1rem); margin-bottom:8px; }
.hall-tabs{ display:flex; flex-wrap:wrap; gap:8px; margin-top:22px; }
.htab{ border:1px solid rgba(255,255,255,.35); background:transparent; color:#fff; border-radius:999px; padding:9px 16px; font-weight:500; font-size:.9rem; cursor:pointer; transition:background .25s, color .25s; }
.htab:hover{ background:rgba(255,255,255,.12); }
.htab[aria-pressed="true"]{ background:#fff; color:var(--green); border-color:#fff; }
.meet-feats{ display:flex; flex-wrap:wrap; gap:10px; margin-top:clamp(30px,4vw,50px); }
.meet-feats span{ display:inline-flex; align-items:center; gap:9px; padding:11px 18px; border-radius:999px; background:rgba(255,255,255,.1); font-size:.93rem; }
.meet-feats svg{ color:#C4B5AB; }

/* ---------------- TOUR SPOTLIGHT ---------------- */
.tour{ position:relative; border-radius:clamp(28px,4vw,48px); overflow:hidden; height:min(76svh, 720px); min-height:460px; background:var(--coffee); cursor:none; }
.tour .base, .tour .sharp{ position:absolute; inset:0; }
.tour .base img, .tour .sharp img{ width:100%; height:100%; object-fit:cover; }
.tour .base img{ filter:blur(14px) saturate(.5) brightness(.55); transform:scale(1.08); }
.tour .sharp{ -webkit-mask-image:radial-gradient(circle var(--rad, 170px) at var(--mx, 50%) var(--my, 50%), #000 60%, transparent 100%); mask-image:radial-gradient(circle var(--rad, 170px) at var(--mx, 50%) var(--my, 50%), #000 60%, transparent 100%); }
.tour .ring{ position:absolute; left:var(--mx, 50%); top:var(--my, 50%); width:calc(var(--rad, 170px) * 2); height:calc(var(--rad, 170px) * 2); transform:translate(-50%,-50%); border-radius:50%; border:2px solid rgba(255,255,255,.55); pointer-events:none; }
.tour-ui{ position:absolute; z-index:3; left:0; right:0; bottom:0; padding:clamp(22px,4vw,52px); display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:20px; color:#fff; pointer-events:none; }
.tour-ui > *{ pointer-events:auto; }
.tour-ui h2{ color:#fff; max-width:14ch; }
.tour-ui .btn{ cursor:pointer; }
.badge360{ position:absolute; z-index:3; right:clamp(22px,4vw,52px); top:clamp(22px,4vw,52px); width:96px; height:96px; border-radius:50%; background:var(--green); color:#fff; display:grid; place-items:center; font-family:var(--display); font-weight:700; font-size:1.3rem; animation:turn 14s linear infinite; }
.badge360::after{ content:""; position:absolute; inset:8px; border-radius:50%; border:1.5px dashed rgba(36,22,15,.4); }

/* ---------------- GALLERY ---------------- */
.gal-head{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end; gap:24px; margin-bottom:30px; }
.filters{ display:flex; flex-wrap:wrap; gap:8px; }
.filter{ border:2px solid var(--line); background:#fff; border-radius:999px; padding:9px 16px; font-size:.9rem; font-weight:600; cursor:pointer; color:var(--ink-2); transition:background .2s, color .2s, border-color .2s, transform .3s var(--spring); }
.filter:hover{ transform:translateY(-2px); border-color:var(--ink-3); }
.filter[aria-pressed="true"]{ background:var(--ink); border-color:var(--ink); color:#fff; }
.masonry{ columns:4 240px; column-gap:14px; }
.shot{ break-inside:avoid; margin:0 0 14px; cursor:zoom-in; border:0; padding:0; background:none; display:block; width:100%; text-align:left; animation:shot-in .55s var(--spring); }
@keyframes shot-in{ from{ opacity:0; transform:scale(.94); } }
.shot .frame{ border-radius:20px; }
.shot .frame img{ transition:transform 1s var(--ease); }
.shot:hover .frame img{ transform:scale(1.06); }
.shot .cap{ position:absolute; left:10px; bottom:10px; z-index:1; padding:6px 12px; border-radius:999px; background:rgba(255,253,249,.92); font-size:.8rem; font-weight:600; opacity:0; transform:translateY(6px); transition:opacity .3s, transform .4s var(--spring); }
.shot:hover .cap, .shot:focus-visible .cap{ opacity:1; transform:none; }
.shot[hidden]{ display:none; }
.lightbox{ position:fixed; inset:0; z-index:700; background:rgba(20,11,7,.94); display:none; align-items:center; justify-content:center; padding:clamp(16px,4vw,64px); }
.lightbox.open{ display:flex; animation:fadein .3s ease; }
.lightbox figure{ margin:0; text-align:center; }
.lightbox img{ max-height:80vh; max-width:100%; border-radius:16px; object-fit:contain; margin:auto; }
.lightbox figcaption{ color:#fff; margin-top:16px; }
.lb-btn{ position:absolute; width:54px; height:54px; border-radius:50%; background:var(--green); border:0; color:#fff; cursor:pointer; display:grid; place-items:center; transition:transform .3s var(--spring); }
.lb-btn:hover{ transform:scale(1.08); }
.lb-close{ top:20px; right:20px; background:#fff; }
.lb-prev{ left:20px; top:50%; margin-top:-27px; }
.lb-next{ right:20px; top:50%; margin-top:-27px; }

/* ---------------- POSTCARDS ---------------- */
.cards-sec{ background:var(--mist); overflow:hidden; }
.reviews{ display:grid; grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr); gap:clamp(30px,5vw,80px); align-items:center; }
.score{ display:flex; align-items:center; gap:18px; margin-top:28px; }
.postmark{ width:112px; height:112px; border-radius:50%; border:3px solid var(--blue); color:var(--blue); display:grid; place-items:center; text-align:center; transform:rotate(-12deg); font-size:.66rem; font-weight:600; letter-spacing:.06em; line-height:1.2; }
.postmark b{ display:block; font-family:var(--display); font-size:1.9rem; letter-spacing:-.04em; }
.deck{ position:relative; height:clamp(330px, 36vw, 400px); }
.postcard{
  position:absolute; inset:0 6% 0 0; background:#FFFEFA; border-radius:18px; padding:clamp(22px,3vw,34px);
  display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr); gap:24px; cursor:pointer; border:0; text-align:left; color:var(--ink);
  box-shadow:0 24px 60px rgba(36,22,15,.14), 0 1px 0 var(--line);
  transition:transform .8s var(--spring), opacity .5s, z-index 0s .3s;
}
.postcard::before{ content:""; position:absolute; left:0; right:0; top:0; height:10px; border-radius:18px 18px 0 0; background:var(--tibeb) 0 50% / auto 10px repeat-x; }
.postcard .msg{ font-family:var(--hand); font-size:clamp(1.55rem, 2.4vw, 2.1rem); line-height:1.15; color:var(--coffee); padding-top:12px; border-right:1px solid var(--line); padding-right:22px; }
.postcard .side{ display:flex; flex-direction:column; align-items:flex-end; justify-content:space-between; padding-top:12px; }
.stamp{ width:86px; height:100px; padding:6px; background:#fff; border:2px dashed var(--line); display:flex; flex-direction:column; justify-content:flex-end; align-items:center; font-size:.62rem; font-weight:700; letter-spacing:.04em; color:var(--ink-2); gap:4px; }
.stamp i{ display:grid; place-items:center; width:100%; flex:1; font-style:normal; color:#fff; font-family:var(--display); font-size:1.15rem; border-radius:2px; }
.from{ text-align:right; font-size:.9rem; color:var(--ink-3); }
.from b{ display:block; color:var(--ink); font-size:1.05rem; }
.lines{ width:100%; }
.lines i{ display:block; height:1px; background:var(--line); margin:14px 0; }
.deck-nav{ display:flex; gap:10px; margin-top:34px; }
.round{ width:54px; height:54px; border-radius:50%; border:2px solid var(--ink); background:transparent; cursor:pointer; display:grid; place-items:center; transition:background .2s, color .2s, transform .3s var(--spring); }
.round:hover{ background:var(--ink); color:#fff; transform:scale(1.06); }

/* ---------------- CONTACT: ARRIVALS BOARD ---------------- */
.contact-grid{ display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(24px,4vw,56px); }
.board{ background:#140B07; color:#F5E9DA; border-radius:28px; padding:clamp(20px,3vw,34px); box-shadow:0 30px 70px rgba(20,11,7,.25); }
.board-top{ display:flex; justify-content:space-between; align-items:center; gap:12px; margin-bottom:16px; }
.board-top b{ font-family:var(--display); font-weight:600; color:#7DFFB0; letter-spacing:.02em; }
.board-top span{ font-size:.8rem; color:rgba(245,233,218,.55); }
.brow{ display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,.6fr) minmax(0,.8fr); gap:12px; align-items:center; padding:10px 0; border-top:1px solid rgba(245,233,218,.1); font-size:.92rem; }
.brow.h{ font-size:.72rem; letter-spacing:.08em; color:rgba(245,233,218,.5); border-top:0; padding-top:0; }
.flap{ display:inline-flex; gap:2px; font-family:var(--sans); font-weight:700; font-size:.9rem; flex-wrap:wrap; }
.flap i{ font-style:normal; display:inline-grid; place-items:center; min-width:1.05em; padding:3px 1px; background:#1A3324; color:#C8F0D8; border-radius:3px; line-height:1.3; box-shadow:inset 0 -1px 0 rgba(0,0,0,.6), inset 0 1px 0 rgba(255,255,255,.04); }
.flap i.sp{ background:transparent; box-shadow:none; min-width:.45em; }
.status{ justify-self:start; font-size:.78rem; font-weight:600; padding:4px 10px; border-radius:999px; }
.status.walk{ background:rgba(22,98,74,.35); color:#9FE0C4; }
.status.drive{ background:rgba(122,105,96,.25); color:#D4C4B8; }
.status.shuttle{ background:rgba(210,60,42,.25); color:#FFB3A6; }
.map{ border-radius:28px; overflow:hidden; min-height:280px; margin-top:18px; background:var(--mist); }
.map iframe{ width:100%; height:100%; min-height:280px; border:0; display:block; }
.contact-cards{ display:grid; gap:12px; align-content:start; }
.ccard{ display:flex; align-items:center; gap:16px; text-decoration:none; padding:18px 20px; border-radius:22px; background:var(--mist); transition:transform .4s var(--spring), background .25s; }
.ccard:hover{ transform:translateX(6px); background:var(--wash); }
.ccard .ci{ width:48px; height:48px; border-radius:50%; background:#fff; display:grid; place-items:center; flex:none; color:var(--green); }
.ccard small{ display:block; font-size:.8rem; color:var(--ink-3); }
.ccard b{ font-weight:600; }

/* ---------------- FINALE + FOOTER ---------------- */
.finale{ text-align:center; }
.finale h2{ font-size:clamp(2.4rem, 6vw, 5.8rem); max-width:16ch; margin:0 auto 24px; }
.finale .lead{ margin:0 auto 36px; }
.finale .actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; }
.footer{
  position:relative;
  background:
    linear-gradient(180deg, rgba(14,128,64,.06) 0%, transparent 42%),
    var(--white);
  color:var(--ink-2);
  border-top:1px solid var(--line);
  overflow:hidden;
}
.footer::before{
  content:"";
  position:absolute; inset:auto -10% -40% auto;
  width:min(520px, 70vw); aspect-ratio:1; border-radius:50%;
  background:radial-gradient(circle, rgba(14,128,64,.1), transparent 68%);
  pointer-events:none;
}
.footer .tibeb-band{ opacity:.85; }
.footer .inner{ position:relative; z-index:1; padding-block:clamp(56px,7vw,90px) 30px; }
.footer .cols{ display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:36px; }
.footer .brand b{ color:var(--ink); font-size:1.4rem; }
.footer .brand small{ color:var(--ink-3); }
.footer .brand-blurb{ margin-top:20px; max-width:36ch; color:var(--ink-2); line-height:1.55; }
.footer h4{
  color:var(--green); margin-bottom:14px;
  font-family:var(--sans); font-size:.78rem; font-weight:700;
  letter-spacing:.12em; text-transform:uppercase;
}
.footer ul{ list-style:none; margin:0; padding:0; display:grid; gap:9px; }
.footer a{ text-decoration:none; color:var(--ink-2); transition:color .2s; }
.footer a:hover{ color:var(--green); }
.socials{ display:flex; gap:10px; margin-top:22px; }
.socials a{
  width:44px; height:44px; border-radius:50%;
  background:transparent; color:var(--green);
  border:1.5px solid rgba(14,128,64,.28);
  display:grid; place-items:center;
  transition:background .25s, color .25s, border-color .25s, transform .3s var(--spring);
}
.socials a:hover{
  background:var(--green); color:#fff; border-color:var(--green);
  transform:translateY(-3px);
}
.giant{
  font-family:var(--display); font-weight:700;
  font-size:clamp(2.8rem, 12.6vw, 13rem); letter-spacing:-.06em; line-height:.8;
  margin-top:clamp(40px,6vw,80px);
  color:transparent; -webkit-background-clip:text; background-clip:text;
  background-image:var(--tibeb), linear-gradient(180deg, rgba(14,128,64,.28), rgba(14,128,64,.12));
  background-size:192px 64px, 100% 100%;
  animation:weave 40s linear infinite;
  user-select:none; white-space:nowrap; overflow:hidden;
}
.footer .base{
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:12px;
  padding-top:22px; margin-top:26px;
  border-top:1px solid var(--line);
  font-size:.86rem; color:var(--ink-3);
}

/* ---------------- CONCIERGE ---------------- */
.fab{ position:fixed; right:20px; bottom:20px; z-index:300; width:62px; height:62px; border-radius:50%; border:0; cursor:pointer; background:var(--green); color:#fff; display:grid; place-items:center; box-shadow:0 14px 34px rgba(22,98,74,.4); transition:transform .4s var(--spring), opacity .3s; }
.fab:hover{ transform:scale(1.08) rotate(-8deg); }
.fab .dotp{ position:absolute; top:6px; right:6px; width:13px; height:13px; border-radius:50%; background:#fff; border:2px solid var(--green); }
.assistant{ position:fixed; right:20px; bottom:94px; z-index:310; width:min(390px, calc(100vw - 32px)); height:min(560px, calc(100svh - 130px)); background:#fff; border-radius:28px; box-shadow:0 30px 90px rgba(36,22,15,.3); display:flex; flex-direction:column; overflow:hidden; opacity:0; visibility:hidden; transform:translateY(20px) scale(.96); transform-origin:bottom right; transition:opacity .3s, transform .5s var(--spring), visibility .3s; }
.assistant.open{ opacity:1; visibility:visible; transform:none; }
.as-head{ background:var(--green); color:#fff; padding:18px 20px 22px; position:relative; }
.as-head::after{ content:""; position:absolute; left:0; right:0; bottom:0; height:8px; background:var(--tibeb) 0 50% / auto 8px repeat-x; }
.as-head .row{ display:flex; align-items:center; gap:12px; }
.as-head .gz{ font-family:var(--geez); font-size:1.1rem; }
.as-head b{ display:block; }
.as-head small{ opacity:.8; font-size:.8rem; }
.as-head button{ margin-left:auto; width:38px; height:38px; border-radius:50%; border:0; background:rgba(255,255,255,.14); color:#fff; cursor:pointer; display:grid; place-items:center; }
.as-body{ flex:1; overflow-y:auto; padding:18px; display:flex; flex-direction:column; gap:10px; background:var(--white); }
.msg{ max-width:86%; padding:11px 15px; border-radius:20px; font-size:.93rem; line-height:1.45; animation:shot-in .4s var(--spring); }
.msg.bot{ background:#fff; border:1px solid var(--line); border-bottom-left-radius:6px; }
.msg.me{ align-self:flex-end; background:var(--ink); color:#fff; border-bottom-right-radius:6px; }
.msg a{ font-weight:600; }
.chips-row{ display:flex; flex-wrap:wrap; gap:7px; padding:10px 16px; background:var(--white); }
.qchip{ border:1.5px solid var(--line); background:#fff; border-radius:999px; padding:7px 13px; font-size:.84rem; font-weight:500; cursor:pointer; transition:border-color .2s, background .2s; }
.qchip:hover{ border-color:var(--green); background:var(--wash); }
.as-form{ display:flex; gap:8px; padding:12px; border-top:1px solid var(--line); }
.as-form input{ flex:1; border:1.5px solid var(--line); border-radius:999px; padding:11px 16px; }
.as-form input:focus{ outline:none; border-color:var(--green); }
.as-form button{ width:46px; height:46px; border-radius:50%; border:0; background:var(--green); color:#fff; cursor:pointer; display:grid; place-items:center; flex:none; }

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{ animation-duration:.001ms !important; animation-delay:0s !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; }
  html{ scroll-behavior:auto; }
  .rv, .pop,
  .hero h1 .ln > span,
  .hero .lead,
  .hero-cta,
  .stars{ opacity:1 !important; transform:none !important; }
  .fill .w{ opacity:1; }
  .brand-moment{ height:auto; }
  .bm-stage{ position:relative; height:70vh; }
  .bm-word span, .bm-geez, .bm-cap{ --bp:1; }
}

/* ---------------- RESPONSIVE ---------------- */
@media (max-width:1320px){ .nav-clock{ display:none; } }
@media (max-width:1150px){
  .fields{ grid-template-columns:1fr 1fr; }
  .fld-guests{ grid-column: span 2; }
}
@media (max-width:640px){
  .fld-guests{ grid-column: span 1; }
  .guest-pair{ grid-template-columns:1fr; }
}
@media (max-width:980px){
  .links{ position:fixed; inset:0; z-index:-1; flex-direction:column; justify-content:center; padding:100px var(--gutter) 40px; gap:4px; background:var(--green); clip-path:circle(0 at calc(100% - 50px) 44px); transition:clip-path .7s cubic-bezier(.7,0,.25,1); }
  .links.open{ clip-path:circle(160% at calc(100% - 50px) 44px); }
  .links a{ font-family:var(--display); font-weight:600; font-size:clamp(1.6rem, 7vw, 2.4rem); letter-spacing:-.03em; color:var(--ink); padding:8px 0; }
  .links a:hover{ background:transparent; }
  .burger{ display:grid; }
  .nav .btn{ display:none; }
  .hero{ grid-template-columns:1fr; padding-top:120px; }
  .dial-wrap{ width:min(92%, 480px); margin-top:20px; }
  .pass{ grid-template-columns:1fr; }
  .pass-main{ border-right:0; border-bottom:2px dashed var(--line); }
  .pass-main::before, .pass-main::after{ right:auto; top:auto; bottom:-17px; }
  .pass-main::before{ left:-16px; } .pass-main::after{ right:-16px; left:auto; }
  .pass-stub{ border-radius:0 0 28px 28px; }
  .story, .spa, .meet-grid, .reviews, .contact-grid, .moment{ grid-template-columns:1fr; }
  .feats{ grid-template-columns:1fr; }
  .lift{ grid-template-columns:1fr; }
  .lift-btns{ grid-template-columns:repeat(5, minmax(0,1fr)); }
  .lbtn{ flex-direction:column; gap:6px; font-size:.72rem; text-align:center; padding:4px; }
  .panel .note{ display:none; }
  .car{ min-height:440px; }
  .footer .cols{ grid-template-columns:1fr 1fr; }
  .hours{ overflow-x:auto; scrollbar-width:none; }
  .hours::-webkit-scrollbar{ display:none; }
  .hour{ flex:0 0 76px; }
  .stack{ max-width:420px; margin-inline:auto; width:100%; }
  .tour{ cursor:default; }
}
@media (max-width:980px){
  .pill-book{ left:14px; right:90px; padding:6px; justify-content:center; }
  .pill-book > span{ display:none; }
  .pill-book .btn{ width:100%; }
}
@media (max-width:600px){
  .fields{ grid-template-columns:1fr; }
  .route-row{ gap:12px; }
  .chip{ font-size:.7rem; padding:8px 12px; }
  .chip b{ font-size:.9rem; }
  .chip.c1{ left:-2%; top:4%; } .chip.c2{ right:-2%; top:44%; } .chip.c3{ left:0; bottom:0; }
  .spec{ grid-template-columns:1fr; }
  .postcard{ grid-template-columns:1fr; inset:0; }
  .postcard .msg{ border-right:0; padding-right:0; font-size:1.6rem; }
  .postcard .side{ flex-direction:row; align-items:flex-end; }
  .postcard .lines{ display:none; }
  .deck{ height:400px; }
  .brow{ grid-template-columns:minmax(0,1fr) auto; }
  .brow > :nth-child(3){ grid-column:1 / -1; }
  .brow.h > :nth-child(3){ display:none; }
  .footer .cols{ grid-template-columns:1fr; }
  .hero-cta .btn{ flex:1; }
  .masonry{ columns:2 140px; column-gap:10px; }
}

/* Keep landing above legacy homepage styles without changing brand tokens */
body.azzeman-landing {
  background: var(--white) !important;
  color: #24160F !important;
  font-family: var(--sans) !important;
}

/* Legacy style.css: section[id] { opacity:0; transform:translateY(20px) }.
   Opacity must stay 1. Transform MUST be none — any transform on #bm
   breaks position:sticky for the AZZEMAN brand-moment scrub. */
body.azzeman-landing section[id],
body.azzeman-landing section[id].is-visible {
  opacity: 1 !important;
  transform: none !important;
  visibility: visible !important;
}

/* Keep brand-moment scroll track + sticky stage working (matches azzeman-hotel.html) */
html:has(body.azzeman-landing),
html:has(body.azzeman-landing) body {
  height: auto !important;
  min-height: 100% !important;
  overflow-x: visible !important;
  overflow-y: visible !important;
}
body.azzeman-landing #main {
  overflow: visible !important;
  transform: none !important;
  filter: none !important;
  perspective: none !important;
  contain: none !important;
}
body.azzeman-landing #bm.brand-moment {
  height: 200vh !important;
  min-height: 200vh !important;
  position: relative !important;
  transform: none !important;
  filter: none !important;
  overflow: visible !important;
}
body.azzeman-landing #bm .bm-stage {
  position: sticky !important;
  top: 0 !important;
  height: 100svh !important;
  transform: none !important;
}
body.azzeman-landing .hero,
body.azzeman-landing .hero h1,
body.azzeman-landing .hero h2,
body.azzeman-landing .hero p,
body.azzeman-landing .hero a,
body.azzeman-landing .copy,
body.azzeman-landing .lead,
body.azzeman-landing .btn-line {
  color: #24160F !important;
  visibility: visible !important;
}
body.azzeman-landing .btn-sun {
  color: #fff !important;
  background: #0E8040 !important;
  box-shadow: 0 8px 0 #0A5C2E !important;
  visibility: visible !important;
}
body.azzeman-landing .whatsapp-button { z-index: 90; }

/* Legacy style.css hides lazy images until .loaded — landing never adds that class */
body.azzeman-landing img[loading="lazy"],
body.azzeman-landing img[loading="lazy"].loaded {
  opacity: 1 !important;
}
