/* site.css (O38-WEB, 16.10.2026): gemeinsame Basis aller Seiten von unser-dubai.com (Startseite und Unterseiten).
   Tokens der App hell/dunkel (Quelle: UD-Pilot/www/app/index.html, html.rv-design), Grundlagen, Kopfzeile, Bausteine (Eyebrow, Knoepfe,
   Store-Knoepfe, Pfeil-Links), Scroll-Reveal, Fuss mit Darstellungs-Umschalter. Aus home.css herausgeloest (Reihenfolge und Werte unveraendert).
   Modus: folgt prefers-color-scheme; html[data-ud-theme="light"|"dark"] ueberschreibt (setzt ein Inline-Skript im <head> vor dem ersten Bild).
   Seiten tragen <body class="ud …">. Systemschrift, keine Webfonts. Animationen nur transform/opacity. */

/* ---------- Tokens hell (App: html.rv-design) ---------- */
:root{
  --t-bg:#F6F4F0; --t-surface:#FFFFFF; --t-surface-2:#F0EDE7; --t-glass:rgba(255,255,255,.82);
  --t-line:rgba(13,34,56,.09); --t-line-2:rgba(13,34,56,.16);
  --t-ink:#0D2238; --t-ink-2:#43536A; --t-ink-3:#5E6A79;
  --t-accent:#B2872F; --t-accent-soft:#F3EAD6; --t-accent-ink:#7A5A14;
  --t-primary:#0D2238; --t-primary-press:#1B3452; --t-on-primary:#FFFFFF;
  --t-info-bg:#EEF1F5;
  --t-s1:0 1px 2px rgba(13,34,56,.05); --t-s2:0 1px 2px rgba(13,34,56,.04),0 8px 24px rgba(13,34,56,.07); --t-s3:0 16px 40px rgba(13,34,56,.14);
  --t-r-sm:10px; --t-r-md:14px; --t-r-lg:18px; --t-r-xl:24px;
  --t-ease-out:cubic-bezier(.23,1,.32,1);
  --t-font:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Inter","Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  /* abgeleitet fuer die Startseite */
  --alt:var(--t-surface-2); --bg-rgb:246,244,240; --foot-bg:#0D2238; --foot-ink:rgba(255,255,255,.92); --foot-mut:rgba(255,255,255,.66); --foot-line:rgba(255,255,255,.14);
  /* 3D-Szene (RGB-Tripel + Deckkraft), von earth3d.js gelesen */
  --x3d-mode:light; --x3d-land:13,34,56; --x3d-land-a:.72; --x3d-sea:13,34,56; --x3d-sea-a:.10; --x3d-route:178,135,47; --x3d-head:122,90,20; --x3d-city:13,34,56;
  --x3d-body-lo:234,229,220; --x3d-body-hi:255,255,255; --x3d-rim:40,74,128; --x3d-rim-a:.22; --x3d-glow:40,74,128; --x3d-glow-a:.16; --x3d-stars:0;
  color-scheme:light;
}
/* ---------- Tokens dunkel (App: html.rv-design[data-ud-theme="dark"]) ---------- */
@media (prefers-color-scheme:dark){
  :root:not([data-ud-theme="light"]){
    --t-bg:#0A121D; --t-surface:#121C2A; --t-surface-2:#1A2636; --t-glass:rgba(12,20,32,.82);
    --t-line:rgba(255,255,255,.08); --t-line-2:rgba(255,255,255,.15);
    --t-ink:#EEF1F6; --t-ink-2:#B6C0CD; --t-ink-3:#939FAE;
    --t-accent:#D2AF62; --t-accent-soft:rgba(210,175,98,.15); --t-accent-ink:#E3C98C;
    --t-primary:#EEF1F6; --t-primary-press:#D6DCE5; --t-on-primary:#0A121D; --t-info-bg:#172335;
    --t-s1:none; --t-s2:0 0 0 1px rgba(255,255,255,.02); --t-s3:0 16px 40px rgba(0,0,0,.45);
    --alt:var(--t-surface); --bg-rgb:10,18,29; --foot-bg:#121C2A; --foot-ink:#EEF1F6; --foot-mut:#B6C0CD; --foot-line:rgba(255,255,255,.08);
    --x3d-mode:dark; --x3d-land:210,175,98; --x3d-land-a:.78; --x3d-sea:238,241,246; --x3d-sea-a:.06; --x3d-route:210,175,98; --x3d-head:255,236,200; --x3d-city:238,241,246;
    --x3d-body-lo:10,18,29; --x3d-body-hi:24,38,58; --x3d-rim:210,175,98; --x3d-rim-a:.22; --x3d-glow:210,175,98; --x3d-glow-a:.14; --x3d-stars:1;
    color-scheme:dark;
  }
}
:root[data-ud-theme="dark"]{
  --t-bg:#0A121D; --t-surface:#121C2A; --t-surface-2:#1A2636; --t-glass:rgba(12,20,32,.82);
  --t-line:rgba(255,255,255,.08); --t-line-2:rgba(255,255,255,.15);
  --t-ink:#EEF1F6; --t-ink-2:#B6C0CD; --t-ink-3:#939FAE;
  --t-accent:#D2AF62; --t-accent-soft:rgba(210,175,98,.15); --t-accent-ink:#E3C98C;
  --t-primary:#EEF1F6; --t-primary-press:#D6DCE5; --t-on-primary:#0A121D; --t-info-bg:#172335;
  --t-s1:none; --t-s2:0 0 0 1px rgba(255,255,255,.02); --t-s3:0 16px 40px rgba(0,0,0,.45);
  --alt:var(--t-surface); --bg-rgb:10,18,29; --foot-bg:#121C2A; --foot-ink:#EEF1F6; --foot-mut:#B6C0CD; --foot-line:rgba(255,255,255,.08);
  --x3d-mode:dark; --x3d-land:210,175,98; --x3d-land-a:.78; --x3d-sea:238,241,246; --x3d-sea-a:.06; --x3d-route:210,175,98; --x3d-head:255,236,200; --x3d-city:238,241,246;
  --x3d-body-lo:10,18,29; --x3d-body-hi:24,38,58; --x3d-rim:210,175,98; --x3d-rim-a:.22; --x3d-glow:210,175,98; --x3d-glow-a:.14; --x3d-stars:1;
  color-scheme:dark;
}

/* ---------- Grundlagen ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:76px;background:var(--t-bg)}
body.ud{margin:0;background:var(--t-bg);color:var(--t-ink);font-family:var(--t-font);font-size:17px;line-height:1.6;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.ud img{max-width:100%;height:auto;display:block}
:where(.ud) a{color:inherit}
.ud h1,.ud h2,.ud h3{font-family:var(--t-font);font-weight:700;letter-spacing:-.025em;line-height:1.06;margin:0;color:var(--t-ink);text-wrap:balance}
.ud h1 em,.ud h2 em,.ud h3 em{font-style:normal;color:var(--t-accent)}
:where(.ud) p{margin:0}
.ud :focus-visible{outline:2px solid var(--t-accent);outline-offset:3px;border-radius:6px}
.w{width:100%;max-width:1200px;margin:0 auto;padding:0 20px}
.ico{width:20px;height:20px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}

/* Kopfzeile (beim Build aus nav.css) – auf der Startseite in App-Glas und Tokens */
.ud .ud-nav{background:var(--t-glass);border-bottom:1px solid var(--t-line);-webkit-backdrop-filter:saturate(160%) blur(14px);backdrop-filter:saturate(160%) blur(14px);font-family:var(--t-font)}
.ud .ud-nav .brand{color:var(--t-ink);font-weight:700}
.ud .ud-nav .un-top a{color:var(--t-ink-2)}
.ud .ud-nav .un-top a:hover,.ud .ud-nav .un-top a[aria-current="page"]{color:var(--t-ink)}
.ud .ud-nav .un-lang{color:var(--t-ink);border-color:var(--t-line-2);border-radius:var(--t-r-sm)}
.ud .ud-nav .un-lang:hover{background:var(--t-surface-2)}
.ud .ud-nav .un-app{background:var(--t-primary);color:var(--t-on-primary);border-radius:var(--t-r-sm);font-weight:600}
.ud .ud-nav .un-btn{color:var(--t-ink);background:var(--t-surface);border-color:var(--t-line-2);border-radius:var(--t-r-sm)}
.ud .ud-nav .un-btn:hover{background:var(--t-surface-2)}
.ud .ud-nav .un-ic span{background:var(--t-ink)}
.ud .ud-nav .un-panel{background:var(--t-surface);border-bottom-color:var(--t-line);box-shadow:var(--t-s3)}
.ud .ud-nav .un-h{color:var(--t-accent-ink)}
.ud .ud-nav .un-col a{color:var(--t-ink)}
.ud .ud-nav .un-col a:hover,.ud .ud-nav .un-col a[aria-current="page"]{color:var(--t-accent-ink)}
.ud .ud-nav a:focus-visible,.ud .ud-nav button:focus-visible{outline-color:var(--t-accent)}

/* Bausteine */
.eyebrow{display:inline-flex;align-items:center;gap:10px;font-weight:600;font-size:12.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-accent-ink);margin:0 0 16px}
.eyebrow::before{content:"";width:22px;height:2px;border-radius:2px;background:var(--t-accent)}
.center{text-align:center}
.center .eyebrow{justify-content:center}
.lede{font-size:clamp(17px,1.5vw,19px);color:var(--t-ink-2);max-width:620px}
.sec{position:relative;padding:clamp(80px,10vw,136px) 0;overflow:hidden}
.sec-h{max-width:760px}
.sec-h h2{font-size:clamp(32px,4.8vw,56px)}
.sec-h .lede{margin-top:18px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 22px;border-radius:var(--t-r-md);font-weight:600;font-size:16px;text-decoration:none;white-space:nowrap;border:1px solid transparent;transition:transform .16s var(--t-ease-out),background-color .2s ease,border-color .2s ease,color .2s ease}
.btn .ico{width:18px;height:18px;transition:transform .25s var(--t-ease-out)}
.btn:hover .ico{transform:translateX(3px)}
.btn:active,.store:active{transform:scale(.97)}
.btn-primary{background:var(--t-primary);color:var(--t-on-primary);box-shadow:var(--t-s2)}
.btn-primary:hover{background:var(--t-primary-press)}
.btn-ghost{border-color:var(--t-line-2);color:var(--t-ink);background:var(--t-surface)}
.btn-ghost:hover{border-color:var(--t-accent)}
.stores{display:flex;flex-wrap:wrap;gap:10px}
.store{display:inline-flex;align-items:center;gap:12px;min-height:54px;padding:8px 18px 8px 14px;border-radius:var(--t-r-md);border:1px solid var(--t-line-2);background:var(--t-surface);color:var(--t-ink);text-decoration:none;box-shadow:var(--t-s1);transition:border-color .2s ease,transform .16s var(--t-ease-out)}
.store:hover{border-color:var(--t-accent)}
.store .ico{width:24px;height:24px;color:var(--t-accent)}
.store span{display:flex;flex-direction:column;line-height:1.15}
.store small{font-size:11px;letter-spacing:.04em;text-transform:uppercase;color:var(--t-ink-3)}
.store b{font-weight:650;font-size:17px}
.fine{font-size:14px;color:var(--t-ink-3)}
.link-arrow{display:inline-flex;align-items:center;gap:8px;color:var(--t-ink);text-decoration:none;font-weight:600;border-bottom:1px solid var(--t-accent);padding-bottom:2px}
.link-arrow .ico{width:18px;height:18px;color:var(--t-accent);transition:transform .25s var(--t-ease-out)}
.link-arrow:hover .ico{transform:translateX(3px)}

/* Scroll-Reveal (nur mit JS, nur transform/opacity) */
.js .rv{opacity:0;transform:translateY(16px);transition:opacity .7s var(--t-ease-out),transform .7s var(--t-ease-out)}
.js .rv.in{opacity:1;transform:none}
.js .rv.d1{transition-delay:.06s}.js .rv.d2{transition-delay:.12s}.js .rv.d3{transition-delay:.18s}

/* ---------- Fuss (dunkle Flaeche, setzt die Skyline fort) ---------- */
.ud .site-footer{background:var(--foot-bg);color:var(--foot-mut);font-size:14.5px}
.ud .foot-grid{display:grid;grid-template-columns:1fr;gap:28px;padding:48px 0 30px}
.ud .foot-grid h4{font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-accent);margin:0 0 12px}
.ud .foot-grid a{display:block;padding:5px 0;color:var(--foot-mut);text-decoration:none;overflow-wrap:anywhere}
.ud .foot-grid a:hover{color:var(--foot-ink)}
.ud .foot-grid .brand{display:inline-flex;align-items:center;gap:10px;color:var(--foot-ink);font-weight:700;letter-spacing:-.02em;font-size:20px;padding:0;margin-bottom:12px}
.ud .brand-logo{width:34px;height:34px;border-radius:9px}
.ud .foot-about{max-width:340px}
.ud .foot-small{font-size:13px;opacity:.8;margin-top:8px}
.ud .foot-lang,.ud .theme-switch{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.ud .foot-lang a,.ud .theme-switch button{display:inline-block;padding:6px 14px;border:1px solid var(--foot-line);border-radius:999px;font:inherit;font-size:13px;color:var(--foot-mut);background:none;cursor:pointer}
.ud .foot-lang a[aria-current],.ud .theme-switch button[aria-pressed="true"]{border-color:var(--t-accent);color:var(--foot-ink)}
.ud .theme-switch{align-items:center}
.ud .theme-switch span{flex-basis:100%;font-size:12px;letter-spacing:.1em;text-transform:uppercase;margin-right:2px}
.ud .foot-grid .ig-with-ic{display:inline-flex;align-items:center;gap:8px}
.ud .ig-ic{width:15px;height:15px}
.ud .foot-bottom{border-top:1px solid var(--foot-line);padding:20px 0 28px;font-size:13px;color:var(--foot-mut);display:flex;flex-wrap:wrap;gap:8px 18px;justify-content:space-between}
.ud .site-footer .foot-bottom a{color:inherit}

/* ---------- Breakpoints, Touch, reduzierte Bewegung (gemeinsamer Teil) ---------- */
@media (min-width:640px){.w{padding:0 28px}.ud .foot-grid{grid-template-columns:1fr 1fr}}
@media (min-width:900px){.w{padding:0 40px}.ud .foot-grid{grid-template-columns:1.4fr 1fr 1fr 1fr;gap:36px}}
@media (hover:none),(pointer:coarse){.btn:hover .ico,.link-arrow:hover .ico{transform:none}}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .js .rv{transform:none;transition:opacity .4s ease}
  .btn,.btn .ico,.store,.link-arrow .ico{transition:none}
}
@media (pointer:coarse){
  .ud .ud-nav .un-btn,.ud .ud-nav .un-app{min-height:44px}
  .ud .ud-nav .un-lang{min-height:44px;display:inline-flex;align-items:center}
  .ud .foot-grid a{padding:10px 0}
  .ud .foot-lang a,.ud .theme-switch button{min-height:44px;display:inline-flex;align-items:center}
  .link-arrow{min-height:44px}
}

/* ---------- O38-NEWSLETTER: Anmeldung im Fuss (dunkle Flaeche in beiden Darstellungen) ---------- */
.ud .foot-nl{display:grid;grid-template-columns:1fr;gap:14px;padding:36px 0 30px;border-bottom:1px solid var(--foot-line)}
.ud .foot-nl h4{font-weight:700;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--t-accent);margin:0 0 8px}
.ud .foot-nl-txt p{margin:0;color:var(--foot-ink);font-size:16px;line-height:1.45;max-width:420px}
.ud .foot-nl-row{display:flex;flex-wrap:wrap;gap:10px}
.ud .foot-nl .nl-in{flex:1 1 220px;min-width:0;min-height:48px;padding:0 14px;border-radius:var(--t-r-sm);border:1px solid var(--foot-line);background:rgba(255,255,255,.06);color:var(--foot-ink);font:inherit;font-size:16px}
.ud .foot-nl .nl-in::placeholder{color:var(--foot-mut);opacity:.8}
.ud .foot-nl .nl-in[aria-invalid="true"]{border-color:#FF9A8F}
.ud .foot-nl .nl-btn{flex:0 0 auto;min-height:48px;padding:0 20px;border:0;border-radius:var(--t-r-sm);background:var(--t-accent);color:#0D2238;font:inherit;font-size:15.5px;font-weight:700;cursor:pointer}
.ud .foot-nl .nl-btn[disabled]{opacity:.6;cursor:wait}
.ud .foot-nl .nl-in:focus-visible,.ud .foot-nl .nl-btn:focus-visible,.ud .foot-nl .nl-chk input:focus-visible,.ud .foot-nl a:focus-visible{outline:3px solid var(--t-accent);outline-offset:2px}
.ud .foot-nl .nl-chk{display:flex;gap:10px;align-items:flex-start;margin:12px 0 0;font-size:13.5px;line-height:1.5;color:var(--foot-ink);cursor:pointer}
.ud .foot-nl .nl-chk input{flex:none;width:22px;height:22px;margin:0;accent-color:var(--t-accent)}
.ud .foot-nl .nl-small{margin:8px 0 0;font-size:12.5px;line-height:1.5;color:var(--foot-mut)}
.ud .foot-nl .nl-small a{color:var(--foot-ink);text-decoration:underline}
.ud .nl-sr,.ud .nl-hp{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;padding:0;margin:-1px}
.ud .nl-hp{left:-10000px}
.ud .nl-out{margin:10px 0 0;padding:10px 12px;border-radius:var(--t-r-sm);font-size:14px;line-height:1.5;background:rgba(255,255,255,.08);color:var(--foot-ink)}
.ud .nl-out.ok{background:rgba(60,170,110,.18);color:#BFF0D2}
.ud .nl-out.err{background:rgba(220,80,60,.2);color:#FFC9C2}
.ud .fn .nl-out{background:var(--t-info-bg);color:var(--t-ink)}
.ud .fn .nl-out.ok{background:#E7F2EB;color:#1E7148}
.ud .fn .nl-out.err{background:#FBEAE7;color:#A82A1E}
html[data-ud-theme="dark"] .ud .fn .nl-out.ok{background:rgba(60,170,110,.16);color:#9BE0B8}
html[data-ud-theme="dark"] .ud .fn .nl-out.err{background:rgba(220,80,60,.16);color:#FFB3AA}
@media (prefers-color-scheme:dark){html:not([data-ud-theme="light"]) .ud .fn .nl-out.ok{background:rgba(60,170,110,.16);color:#9BE0B8}html:not([data-ud-theme="light"]) .ud .fn .nl-out.err{background:rgba(220,80,60,.16);color:#FFB3AA}}
@media (min-width:900px){.ud .foot-nl{grid-template-columns:1fr 1.3fr;gap:36px;align-items:start}}