:root{--ink:#17332e;--ink2:#25483f;--paper:#e9dfca;--paper2:#f5edda;--rust:#a85235;--gold:#d9ae70;--line:#b7ab92;--white:#fffaf0}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",Arial,sans-serif;font-size:16px;line-height:1.5}
html[lang="ar"] body{font-family:"Cairo",Tahoma,sans-serif}
button,a{font:inherit}
a{color:inherit;text-decoration:none}
button{cursor:pointer}
img{display:block;max-width:100%}
.skip-link{position:absolute;top:-100px;left:12px;z-index:100;background:var(--ink);color:var(--white);padding:10px}
.skip-link:focus{top:8px}
:focus-visible{outline:3px solid var(--rust);outline-offset:4px}
.site-header{display:flex;align-items:center;justify-content:space-between;gap:2rem;padding:1.2rem clamp(1.3rem,4vw,4.2rem);background:var(--paper2);border-bottom:1px solid var(--line);position:relative;z-index:4}
.brand{display:flex;gap:.75rem;align-items:center;font-weight:700;font-size:1.43rem;letter-spacing:.17em;line-height:1}
.brand-mark{display:grid;place-items:center;width:2.1rem;height:2.1rem;border:1.5px solid var(--rust);color:var(--rust);transform:rotate(45deg);font-size:1.4rem;line-height:1}
.brand-mark::first-letter{transform:rotate(-45deg)}
.brand small{display:block;font-size:.54rem;letter-spacing:.2em;margin-top:.44rem;color:var(--rust)}
.site-header nav{display:flex;gap:clamp(1rem,2vw,2.3rem);font-size:.78rem;text-transform:uppercase;letter-spacing:.13em;font-weight:700}
.site-header nav a:hover,.site-header nav a:focus-visible{color:var(--rust)}
.header-actions{display:flex;align-items:center;gap:1.1rem}
.language{border:0;background:none;color:var(--ink);font-weight:800;padding:.55rem .2rem;white-space:nowrap}
.header-cta,.primary-button{display:inline-flex;align-items:center;justify-content:center;padding:.88rem 1.25rem;background:var(--ink);color:var(--white);border:1px solid var(--ink);font-size:.78rem;letter-spacing:.12em;text-transform:uppercase;font-weight:700;transition:background .2s,color .2s,transform .2s}
.header-cta:hover,.primary-button:hover{background:var(--rust);border-color:var(--rust);transform:translateY(-2px)}
.hero{min-height:580px;display:grid;grid-template-columns:43% 57%;background:var(--paper2);overflow:hidden}
.hero-copy{padding:clamp(3.3rem,6.8vw,7.3rem) 2rem 2.4rem clamp(1.3rem,4vw,4.2rem);display:flex;flex-direction:column;align-items:flex-start;position:relative;z-index:1}
.section-kicker{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;font-weight:800;color:var(--rust)}
.section-kicker .line{width:2.7rem;height:2px;background:var(--rust);display:inline-block;vertical-align:middle;margin-inline-end:1rem}
h1,h2,h3,p{margin:0}
h1,h2,h3{font-family:"Libre Baskerville",Georgia,serif;font-weight:400}
html[lang="ar"] h1,html[lang="ar"] h2,html[lang="ar"] h3{font-family:"Cairo",Tahoma,sans-serif;font-weight:700;letter-spacing:0}
.hero h1{font-size:clamp(3.2rem,5.3vw,6.3rem);line-height:1.06;letter-spacing:-.08em;margin:1.5rem 0 1.65rem;max-width:700px}
.hero p{max-width:27rem;font-size:1.08rem;color:var(--ink2);line-height:1.7;margin-bottom:2rem}
.hero-coordinate{margin-top:auto;padding-top:2.5rem;font-size:.68rem;letter-spacing:.17em;font-weight:700;color:var(--rust)}
.hero-coordinate span{display:block;color:var(--ink);margin-top:.35rem}
.hero-image{min-height:580px;position:relative;background:linear-gradient(90deg,var(--paper2) 0%,#f5edda00 24%),linear-gradient(0deg,#142b27ac 0%,transparent 38%),url("assets/hero.webp") center/cover no-repeat}
.hero-image-label,.hero-image-credit{position:absolute;color:white;font-size:.72rem;font-weight:700;letter-spacing:.15em}
.hero-image-label{left:2rem;bottom:2.1rem;border-left:2px solid var(--gold);padding-left:.7rem}
.hero-image-credit{right:2rem;bottom:2.1rem}
.intro-strip{display:flex;align-items:center;justify-content:space-evenly;gap:1rem;flex-wrap:wrap;padding:1rem 1.3rem;background:var(--ink);color:var(--paper2);font-size:.72rem;letter-spacing:.19em;font-weight:700;text-align:center}
.strip-separator{color:var(--gold);font-size:1.2rem}
.section-pad{padding:clamp(4rem,7vw,7.5rem) clamp(1.3rem,4vw,4.2rem)}
.section-heading{display:flex;align-items:end;justify-content:space-between;gap:2rem;margin-bottom:2.5rem}
.section-heading h2,.story h2,.follow h2{font-size:clamp(2.4rem,4vw,4.4rem);line-height:1.18;letter-spacing:-.055em;margin-top:.9rem}
.section-heading p{max-width:30rem;color:var(--ink2);font-size:1.05rem;line-height:1.65}
.world{background:var(--paper)}
.world-layout{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(300px,.75fr);gap:1.1rem}
.map-frame{position:relative;min-height:520px;background:#c7d3c7;overflow:hidden}
.map-frame img{width:100%;height:100%;position:absolute;inset:0;object-fit:cover}
.map-pin{position:absolute;left:31%;top:16%;background:var(--rust);color:white;border:0;padding:.65rem .8rem;display:flex;align-items:center;gap:.5rem;font-size:.7rem;letter-spacing:.1em;font-weight:800;box-shadow:0 5px 20px #0005;transition:transform .2s}
.map-pin:hover{transform:scale(1.05)}
.pin-dot{width:.62rem;height:.62rem;background:white;border-radius:100%}
.map-compass{position:absolute;right:1rem;bottom:1rem;background:#f7f0dfdc;padding:.55rem .8rem;font-weight:800;color:var(--ink)}
.location-detail{background:var(--ink);color:var(--white);padding:2.1rem;display:flex;flex-direction:column}
.detail-number,.detail-foot{font-size:.7rem;letter-spacing:.14em;font-weight:800;text-transform:uppercase;color:var(--gold)}
.location-detail h3{font-size:clamp(2rem,3vw,3rem);line-height:1.2;margin:1.4rem 0 1rem}
.location-detail p{font-size:1rem;line-height:1.65;color:#d9e0d7;margin-bottom:1.6rem}
.location-detail img{width:100%;height:185px;object-fit:cover;margin-top:auto}
.detail-foot{display:flex;justify-content:space-between;gap:1rem;border-top:1px solid #ffffff45;padding-top:1rem;margin-top:1rem}
.story{display:grid;grid-template-columns:48% 52%;background:var(--ink);color:var(--white)}
.story-image{min-height:570px}
.story-image img{width:100%;height:100%;object-fit:cover}
.story-copy{padding:clamp(3rem,6vw,7rem);display:flex;flex-direction:column;justify-content:center}
.story-copy .section-kicker,.follow .section-kicker{color:var(--gold)}
.story h2{max-width:700px;margin-bottom:1.7rem}
.story p{color:#d9e0d7;line-height:1.75;max-width:34rem}
.story-quote{border-left:2px solid var(--gold);padding-left:1.3rem;margin-top:2.2rem;color:var(--gold);font-family:Georgia,serif;font-size:1.1rem;font-style:italic}
.gameplay{background:var(--paper2)}
.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line);border:1px solid var(--line)}
.feature-grid article{background:var(--paper2);padding:2.2rem;min-height:270px}
.feature-index{display:block;color:var(--rust);font-size:.78rem;letter-spacing:.14em;font-weight:800;margin-bottom:2.4rem}
.feature-grid h3{font-size:1.8rem;margin-bottom:.75rem}
.feature-grid p{color:var(--ink2);line-height:1.65}
.gallery{background:var(--paper)}
.gallery-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:1rem}
.gallery figure{margin:0;position:relative;min-height:330px;overflow:hidden}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .3s}
.gallery figure:hover img{transform:scale(1.04)}
.gallery figcaption{position:absolute;left:1rem;bottom:1rem;background:var(--paper2);padding:.5rem .7rem;font-size:.7rem;font-weight:800;letter-spacing:.15em}
.follow{text-align:center;background:var(--rust);color:var(--white);padding:clamp(4rem,6vw,7rem) 1.3rem}
.follow h2{margin:.9rem auto 1.3rem;max-width:850px}
.follow p{max-width:600px;margin:0 auto 2rem;line-height:1.7}
.follow .primary-button{background:var(--white);color:var(--ink);border-color:var(--white)}
.follow .primary-button:hover{background:var(--ink);color:var(--white);border-color:var(--ink)}
footer{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding:2.3rem clamp(1.3rem,4vw,4.2rem);background:#102922;color:var(--paper2)}
.footer-brand{font-weight:800;letter-spacing:.17em;font-size:1.15rem}
.footer-brand span{display:block;font-size:.6rem;color:var(--gold);margin-top:.3rem}
footer p{color:#c7d1c8}footer a{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--gold)}
html[dir="rtl"] .hero h1,html[dir="rtl"] .section-heading h2,html[dir="rtl"] .story h2{letter-spacing:0}
html[dir="rtl"] .hero-image{background-image:linear-gradient(270deg,var(--paper2) 0%,#f5edda00 24%),linear-gradient(0deg,#142b27ac 0%,transparent 38%),url("assets/hero.webp")}
html[dir="rtl"] .hero-image-label{left:auto;right:2rem;border-left:0;border-right:2px solid var(--gold);padding-left:0;padding-right:.7rem}
html[dir="rtl"] .hero-image-credit{right:auto;left:2rem}
html[dir="rtl"] .story-quote{border-left:0;border-right:2px solid var(--gold);padding-left:0;padding-right:1.3rem;font-family:"Cairo",sans-serif;font-style:normal}
html[dir="rtl"] .gallery figcaption{left:auto;right:1rem}
html[dir="rtl"] .map-pin{left:31%;direction:ltr}
@media(max-width:950px){.site-header nav{display:none}.hero{grid-template-columns:1fr 1fr}.hero h1{font-size:clamp(3rem,5vw,4.5rem)}.world-layout{grid-template-columns:1fr .8fr}.gallery-grid{grid-template-columns:1fr 1fr}.gallery-large{grid-column:span 2}}
@media(max-width:680px){.site-header{padding:1rem 1.2rem}.brand{font-size:1.25rem}.header-cta{display:none}.hero{display:flex;flex-direction:column}.hero-copy{padding:3.5rem 1.3rem 2rem}.hero h1{font-size:clamp(3.1rem,11vw,5rem)}.hero-coordinate{padding-top:2.3rem}.hero-image{min-height:310px;background-image:linear-gradient(0deg,#142b27ac 0%,transparent 38%),url("assets/hero.webp")}.intro-strip{gap:.6rem;font-size:.62rem}.strip-separator:last-of-type{display:none}.section-heading{display:block}.section-heading p{margin-top:1rem}.world-layout{grid-template-columns:1fr}.map-frame{min-height:390px}.location-detail{min-height:390px}.story{grid-template-columns:1fr}.story-image{min-height:330px}.story-copy{padding:3.5rem 1.3rem}.feature-grid{grid-template-columns:1fr}.feature-grid article{min-height:auto;padding:1.7rem}.feature-index{margin-bottom:1.5rem}.gallery-grid{grid-template-columns:1fr}.gallery-large{grid-column:auto}.gallery figure{min-height:270px}footer{align-items:flex-start;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Launch edition: The Last Signal, with the journey map below. */
html{scroll-padding-top:1.5rem}
.site-header{background:#081820;color:var(--white);border-color:#ffffff20;gap:1.2rem}
.site-header .language{color:var(--white)}
.site-header .brand small,.site-header .brand-mark{color:var(--gold)}
.site-header .brand-mark{border-color:var(--gold)}
.site-header .header-cta{background:var(--gold);border-color:var(--gold);color:#081820;letter-spacing:.05em}
.site-header nav{letter-spacing:.07em;gap:1.4rem}
.hero{position:relative;isolation:isolate;background:#081820;color:var(--white);grid-template-columns:55% 45%;min-height:700px}
.hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#081820 2%,#081820eb 35%,#08182040 100%),linear-gradient(0deg,#081820,transparent 50%),url("assets/hero.webp") center/cover}
.hero-copy{padding-top:5.5rem;padding-bottom:3rem}
.hero h1{font-size:clamp(3.1rem,5.1vw,6rem);letter-spacing:-.06em;line-height:1.12}
.hero p{color:#d4dedf;max-width:36rem}
.hero .section-kicker,.hero-coordinate,.hero-coordinate span{color:var(--gold)}
.hero .line{background:var(--gold)}
.hero .primary-button{background:var(--gold);border-color:var(--gold);color:#081820}
.hero .primary-button:hover{background:var(--white);border-color:var(--white)}
.hero-image,html[dir="rtl"] .hero-image{background:none;min-height:700px;pointer-events:none}
.hero-image-label{bottom:3rem;left:1rem;font-size:.65rem}
.hero-image-credit{bottom:1rem;right:1rem;font-size:.6rem}
.secondary-button{display:inline-flex;align-items:center;justify-content:center;border-bottom:1px solid #d9ae7080;padding:.7rem 0;color:var(--gold);font-size:.86rem}
.secondary-button:hover{color:var(--white)}
.hero-steam{margin-top:.6rem}
.hero-coordinate{padding-top:1.6rem}
.intro-strip{background:#102833;line-height:1.8}
.story{background:#102833}
.follow{background:#102833;border-top:1px solid #d9ae7040}
.follow .primary-button{background:var(--gold);border-color:var(--gold)}
.primary-button:disabled,.primary-button:disabled:hover{cursor:default;transform:none;background:#243b45;color:#e2c99f;border-color:#718087}
.follow .steam-note{margin:1rem auto 0;font-size:.9rem;color:#cbd5d8;max-width:36rem}
.faq{background:var(--paper2)}
.faq h2,.contact h2{font-size:clamp(2rem,3.8vw,4rem);letter-spacing:-.045em;line-height:1.2;margin:1rem 0 2rem}
.faq-list{max-width:1000px;margin:auto}
.faq details{border-bottom:1px solid var(--line);padding:1.3rem 0}
.faq summary{cursor:pointer;font-size:1.1rem;font-weight:700;padding:.3rem .2rem}
.faq details p{max-width:54rem;padding:.8rem .2rem .3rem;color:var(--ink2);line-height:1.8}
.contact{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center;background:var(--paper)}
.contact p{max-width:33rem;line-height:1.8}
.contact-card{border:1px solid var(--line);padding:2rem;display:flex;align-items:flex-start;flex-direction:column;gap:1.2rem;min-width:0}
.email-address{font-size:clamp(1.1rem,2vw,1.8rem);font-weight:700;overflow-wrap:anywhere;text-decoration:underline;text-underline-offset:.25em}
.contact-note{font-size:.82rem;color:var(--ink2)}
footer{background:#081820}
.primary-button,.header-cta{white-space:normal;text-align:center;max-width:100%;min-height:44px}
.language{min-height:44px;min-width:60px}
.header-actions,.hero-copy,.section-heading>div,.story-copy,.feature-grid article{min-width:0}
html[dir="rtl"] .hero::before{background:linear-gradient(270deg,#081820 2%,#081820eb 35%,#08182040 100%),linear-gradient(0deg,#081820,transparent 50%),url("assets/hero.webp") center/cover}
html[lang="ar"] .section-kicker,html[lang="ar"] .primary-button,html[lang="ar"] .header-cta,html[lang="ar"] .intro-strip{letter-spacing:0}
html[lang="ar"] .hero h1{line-height:1.35;font-size:clamp(2.8rem,4.7vw,5.5rem)}
html[lang="ar"] .faq h2,html[lang="ar"] .contact h2{letter-spacing:0}
@media(min-width:1800px){.section-pad{padding-inline:max(4.2rem,calc((100vw - 1660px)/2))}.hero-copy{padding-inline-start:max(4.2rem,calc((100vw - 1660px)/2))}}
@media(max-width:1100px){.site-header nav{display:none}.hero{grid-template-columns:65% 35%}.hero-copy{padding-top:4rem}.hero h1{font-size:clamp(3rem,5.6vw,4.5rem)}.hero-image-label{max-width:90%;line-height:1.8}.world-layout{grid-template-columns:minmax(0,1fr) minmax(0,.85fr)}}
@media(max-width:760px){.contact{grid-template-columns:1fr;gap:1rem}.contact-card{padding:1.5rem}.hero{display:block;min-height:0}.hero::before,html[dir="rtl"] .hero::before{background:linear-gradient(0deg,#081820 2%,#081820d9 65%,#08182080),url("assets/hero.webp") center/cover}.hero-copy{padding:4rem 1.3rem 2.5rem}.hero h1{font-size:clamp(2.7rem,8.5vw,4.5rem)}.hero-image,html[dir="rtl"] .hero-image{min-height:70px}.hero-image-label,html[dir="rtl"] .hero-image-label{bottom:2.6rem;left:1.3rem;right:auto}.hero-image-credit,html[dir="rtl"] .hero-image-credit{bottom:1rem;left:1.3rem;right:auto}.world-layout{grid-template-columns:1fr}.map-frame{min-height:390px}.section-heading{display:block}.section-heading p{margin-top:1rem}.story{grid-template-columns:1fr}.story-image{min-height:0}.story-image img{aspect-ratio:16/10}.story-copy{padding:3rem 1.3rem}.feature-grid{grid-template-columns:1fr}.feature-grid article{min-height:0}.gallery-grid{grid-template-columns:1fr}.gallery-large{grid-column:auto}.gallery figure{height:300px;min-height:0}.intro-strip{font-size:.65rem;gap:.5rem}.strip-separator{display:none}}
@media(max-width:400px){.site-header{gap:.5rem;padding:.85rem 1rem}.brand{font-size:1.05rem;gap:.6rem}.brand-mark{width:1.65rem;height:1.65rem}.header-actions{gap:.3rem}.hero h1{font-size:2.7rem}.hero p{font-size:1rem}.location-detail{padding:1.3rem}.hero-coordinate{letter-spacing:.08em}.map-frame{min-height:320px}.contact-card{padding:1.2rem}.intro-strip{flex-direction:column}}
.map-frame{aspect-ratio:1;min-height:0;background:#e6d4a8}
.map-frame img{object-fit:contain}
.map-pin,html[dir="rtl"] .map-pin{left:32%;top:3%}
