/* The landing page. Colours and leaf sizes are Pel's own (pel-app/src/api.ts DESIGN, components/leaf.tsx). */
@font-face{font-family:InstrumentSans;src:url('/assets/fonts/instrument-sans-medium.ttf') format('truetype');font-display:swap;font-weight:500}

.landing{--bg:#141312;--bg-2:#1d1b19;--fg:#f7f4ec;--soft:#b9b1a4;--hair:#f7f4ec24;--sun:#e6c440;background:var(--bg);color:var(--fg);transition:background .35s,color .35s}
.landing[data-theme="light"]{--bg:#f7f4ec;--bg-2:#ece6da;--fg:#2b2622;--soft:#655e55;--hair:#2b262226}
.landing h1,.landing h2,.landing h3{font-family:InstrumentSerif,Georgia,serif;font-weight:400;margin:0}
.landing .site-header{border-color:var(--hair)}
.landing .site-header nav{align-items:center;gap:28px}
.theme-toggle{width:40px;height:40px;border-radius:50%;border:1px solid var(--hair);background:none;color:var(--fg);font-size:17px;cursor:pointer}
.theme-toggle:hover{border-color:var(--fg)}
.landing{overflow-x:clip}
.landing .hero{position:relative;z-index:1}
.landing :focus-visible{outline:2px solid var(--sun);outline-offset:4px}

/* Hero */
.landing .hero{min-height:0;display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,400px);align-items:center;gap:clamp(40px,7vw,110px);padding-block:70px 110px}
.from-kurdo{font-size:15px;color:var(--soft);margin:0 0 30px;max-width:330px;line-height:1.5}
.landing .hero h1{font-size:clamp(56px,6.6vw,100px);line-height:.92;letter-spacing:-.045em;margin:0 0 30px}
.lead{font:clamp(22px,2.1vw,28px)/1.36 InstrumentSerif,Georgia,serif;color:var(--soft);max-width:470px;margin:0}
.stores{display:flex;flex-wrap:wrap;gap:12px;margin-top:38px}
.landing .button{font-family:InstrumentSans,Arial,sans-serif;border-radius:100px;min-height:54px;padding:12px 24px;justify-content:center;gap:12px;font-size:15px}
.landing .button img{border-radius:7px}
.landing .button:not([href]){opacity:.62}
.button-sun{background:var(--sun);color:#211e1b}
.button-ghost{border:1px solid var(--fg);color:var(--fg)}
.store-note{font-size:13px;color:var(--soft);margin:14px 0 0}

/* The block of leaves */
.block-wrap{width:min(100%,400px);justify-self:center}
.block{position:relative;margin-top:12px;filter:drop-shadow(0 30px 40px #0008)}
.landing[data-theme="light"] .block{filter:drop-shadow(0 24px 30px #2b262233)}
/* the stub the torn leaves leave behind, and the edges of the days still to come */
.block::before{content:"";position:absolute;inset:-10px -1px auto;height:12px;background:#2b2622}
.block::after{content:"";position:absolute;inset:auto -1px -21px;height:21px;z-index:-1;background:repeating-linear-gradient(to bottom,var(--stack) 0 2px,var(--stack-edge) 2px 3px)}
.block{--stack:#141312;--stack-edge:#f7f4ec2e}
[data-theme="light"] .block{--stack:#f7f4ec;--stack-edge:#2b262238}
.block .under{position:absolute;inset:0}
.block .top{position:relative;aspect-ratio:2/3;perspective:none;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}
.block .top:active{cursor:grabbing}
.top>*{position:absolute;pointer-events:none}
.top .shade{inset:0;background:#000;opacity:0}
.top .track{left:0;top:0}
.top .thrown{inset:10px;background:#000;box-shadow:0 14px 36px #00000073;opacity:0;display:none}
[data-theme="light"] .top .thrown{display:block}
.top .sheet{inset:0}
/* the hint: a finger pulls the leaf a little way, until the visitor has touched it */
.top .finger{left:57%;top:15%;width:64px;height:82px;opacity:0;transition:opacity .3s}
.top .finger.on{opacity:1}
.strip{position:absolute;left:0;width:100%;backface-visibility:hidden;-webkit-backface-visibility:hidden;will-change:transform}
.strip .clip{position:absolute;left:0;right:0;bottom:0;overflow:hidden}
.strip .lit{position:absolute;inset:0;background:#fff;opacity:0}
[data-theme="light"] .strip .lit{background:#000}
.strip>svg{position:absolute;left:0;top:0}
.top .paper{fill:#141312}
.hair{fill:none;stroke:#f7f4ec75;stroke-width:.55}
[data-theme="light"] .top .paper{fill:#f7f4ec}
[data-theme="light"] .hair{stroke:#2b262238}
.block-controls{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-top:48px}
.block-hint{font-size:13px;line-height:1.4;color:var(--soft);margin:0}
.link-button{flex:none;font:600 14px InstrumentSans,Arial,sans-serif;background:none;border:0;border-bottom:1px solid var(--fg);color:var(--fg);padding:4px 0 6px;cursor:pointer}
.link-button:hover{border-color:var(--sun);color:var(--sun)}
.landing[data-theme="light"] .link-button:hover{border-color:#c8402a;color:#c8402a}

/* The leaf. Every size is for a leaf 320 wide: --u is one of those units. */
.leafbox{container-type:inline-size;perspective:1400px;display:block;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;text-align:left}
button.leafbox{cursor:pointer}
.leaf{--u:calc(100cqw/320);--paper:#141312;--ink:#f7f4ec;--edge:#e6c4402e;--ring:#e6c4408c;--ref:#c2ad6e;position:relative;aspect-ratio:2/3;transform-style:preserve-3d;transition:transform .6s cubic-bezier(.3,.7,.3,1)}
[data-theme="light"] .leaf{--paper:#f7f4ec;--ink:#2b2622;--edge:#2b26221f;--ring:#d8d5ce;--ref:#2b262280}
.leaf.turned{transform:rotateY(180deg)}
.face{position:absolute;inset:0;display:flex;flex-direction:column;overflow:hidden;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:var(--paper);color:var(--ink);box-shadow:0 0 0 1px var(--edge);padding:calc(var(--u)*26) calc(var(--u)*26) calc(var(--u)*24);font-family:InstrumentSans,Arial,sans-serif;line-height:1.2}
.face.back{transform:rotateY(180deg)}
.leaf.flat .face{transform:none}
.l-row{display:flex;justify-content:space-between;align-items:baseline;font-weight:500;font-size:calc(var(--u)*11);letter-spacing:.14em;text-transform:uppercase}
[data-theme="light"] .l-row{letter-spacing:.08em}
.l-sunbox{height:calc(var(--u)*150);flex:none;display:grid;place-items:center}
.l-sunbox>*{grid-area:1/1}
.l-sunbox svg{width:calc(var(--u)*165.4);height:calc(var(--u)*165.4)}
.l-sunbox path{fill:#e6c440}
.l-sunbox circle{fill:none;stroke:var(--ring);stroke-width:1px;vector-effect:non-scaling-stroke}
.l-num{font:calc(var(--u)*118)/1 InstrumentSerif,Georgia,serif;letter-spacing:-.03em;margin-right:-.03em;transform:translateY(.025em);color:#2b2622}
/* in the dark the ordinary number is paper-coloured, edged in night, so it stays whole across the sun's edge */
[data-theme="dark"] .l-num.ink{color:#f7f4ec;-webkit-text-stroke:calc(var(--u)*2.5) #141312;paint-order:stroke fill}
.l-num.red{color:#c8402a}
.l-num.green{color:#2f6b3a}
.l-weekday{font-weight:600;font-size:calc(var(--u)*15);text-align:center;margin-top:calc(var(--u)*6)}
.l-kurdish{font-weight:500;font-size:calc(var(--u)*10);letter-spacing:.08em;text-transform:uppercase;text-align:center;color:var(--ref);margin-top:calc(var(--u)*3)}
.l-art{flex:1;min-height:0;margin-top:calc(var(--u)*8);background:var(--d) center bottom/contain no-repeat}
[data-theme="light"] .l-art{background-image:var(--l)}
.l-line{font:italic calc(var(--u)*19)/1.25 InstrumentSerif,Georgia,serif;text-align:center;min-height:calc(var(--u)*24);margin-top:calc(var(--u)*10)}
.leaf mark{color:inherit;background:linear-gradient(transparent 58%,#e6c440b3 58%)}
.l-ref{font-size:.85em;opacity:.5}
.l-small{font-weight:600;font-size:calc(var(--u)*10);letter-spacing:.12em;text-transform:uppercase;opacity:.6}
.l-kind{margin-top:calc(var(--u)*22)}
.l-title{font:calc(var(--u)*34)/1.12 InstrumentSerif,Georgia,serif;margin:calc(var(--u)*10) 0 calc(var(--u)*14)}
.l-text{font-size:calc(var(--u)*15);line-height:1.6;opacity:.8;flex:1}
.l-word{padding-top:calc(var(--u)*14);border-top:1px solid color-mix(in srgb,var(--ink) 20%,transparent)}
.l-wordline{display:flex;align-items:baseline;gap:calc(var(--u)*8);margin:calc(var(--u)*4) 0 calc(var(--u)*6);font:calc(var(--u)*34)/1.1 InstrumentSerif,Georgia,serif}
.l-wordline span{font:calc(var(--u)*13) InstrumentSans,Arial,sans-serif;opacity:.6}
.l-meaning{font-size:calc(var(--u)*13.5);line-height:1.45;margin-bottom:calc(var(--u)*8)}
.l-instead{font-size:calc(var(--u)*11);line-height:1.4;opacity:.6}

/* Sections */
.band{background:var(--bg-2);padding:110px 0}
.section-head{max-width:720px}
.section-head h2{font-size:clamp(44px,5.6vw,80px);line-height:1;letter-spacing:-.04em;margin-bottom:24px}
.section-head p{font:22px/1.4 InstrumentSerif,Georgia,serif;color:var(--soft);max-width:600px;margin:0}
.section-head p.small{font:15px/1.6 InstrumentSans,Arial,sans-serif;margin-top:18px;max-width:520px}

.rail{display:flex;gap:28px;overflow-x:auto;scroll-snap-type:x proximity;padding:60px max(32px,calc((100vw - 1180px)/2)) 30px;scrollbar-width:thin;scrollbar-color:var(--hair) transparent}
.rail figure{flex:none;width:min(72vw,280px);margin:0;scroll-snap-align:center}
.rail figcaption{font:italic 17px/1.35 InstrumentSerif,Georgia,serif;color:var(--soft);margin-top:18px;text-align:center}
.rail .leafbox{filter:drop-shadow(0 14px 18px #0005)}

.words{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,7vw,100px);align-items:start;padding-block:110px}
.wordlist{width:100%;border-collapse:collapse;font-size:15px}
.wordlist thead th{font-size:13px;font-weight:500;color:var(--soft);text-align:left;padding-bottom:12px}
.wordlist td,.wordlist tbody th{border-top:1px solid var(--hair);padding:12px 12px 12px 0;text-align:left;vertical-align:baseline;font-weight:400}
.wordlist tbody th{font:30px/1.1 InstrumentSerif,Georgia,serif;white-space:nowrap}
.wordlist tbody th span{font:13px InstrumentSans,Arial,sans-serif;color:var(--soft);margin-left:8px}
.wordlist mark{color:inherit;background:linear-gradient(transparent 62%,#e6c440b3 62%)}
.wordlist td:last-child{color:var(--soft)}

.phones{display:grid;grid-template-columns:repeat(2,minmax(0,230px));gap:clamp(18px,3vw,40px);margin-top:60px}
.phones figure{margin:0}
.phone{padding:6px;background:#2a2724;border:1px solid #4b463f;border-radius:44px;box-shadow:0 22px 50px #0006;overflow:hidden}
.phone img{display:block;width:100%;height:auto;border-radius:38px}
/* the Dynamic Island, plain: screenshots leave it out, or show whatever was running in it */
.phone{position:relative}
.phone::after{content:"";position:absolute;top:6px;left:50%;width:calc((100% - 12px)*.31);aspect-ratio:3.4;margin-top:calc((100% - 12px)*.033);transform:translateX(-50%);border-radius:100px;background:#000}
.shot-light,[data-theme="light"] .shot-dark{display:none!important}
[data-theme="light"] .shot-light{display:block!important}
/* a torn-off leaf: its top edge is the tear contour */
.leaf>.tear{position:absolute;left:calc(var(--u)*-2);top:calc(var(--u)*-2);width:calc(100% + var(--u)*4);height:calc(var(--u)*9.1);transform:translateZ(1px);pointer-events:none}
.leaf>.tear+.tear{transform:translateZ(-1px)}
.tear .gap{fill:var(--bg-2)}
.phones .phone{border-radius:34px}
.phones .phone img{border-radius:28px}
.phones figcaption{font-size:14px;line-height:1.4;color:var(--soft);margin-top:14px;text-align:center}
/* the top of the home screen only: the two widgets */
.widget{display:grid;grid-template-columns:1fr minmax(280px,440px);gap:clamp(40px,7vw,100px);align-items:center}
.phone-top{border-radius:44px 44px 0 0;border-bottom:0;padding-bottom:0}
.phone-top img{border-radius:38px 38px 0 0}
.steps{margin-top:50px;max-width:520px}
.steps h3{font-size:30px;margin-bottom:14px}
.steps ol{margin:0;padding-left:22px;font-size:16px;line-height:1.7;color:var(--soft)}

.landing .download{background:var(--sun);color:#211e1b;padding:90px 0}
.landing .download h2{font-size:clamp(48px,5.6vw,80px);letter-spacing:-.04em;line-height:1;margin:0 0 16px}
.landing .download p{font:22px/1.4 InstrumentSerif,Georgia,serif;color:#4e4429;max-width:460px;margin:0}
.landing .download-actions{min-width:260px}
.landing .button-dark{background:#211e1b;color:#f7f4ec}
.landing .button-line-dark{border:1px solid #211e1b;color:#211e1b}
.landing .download .store-note{color:#4e4429;margin-top:4px}

.notify{margin-top:36px;max-width:520px;scroll-margin-top:30px}
.notify-title{font-size:15px;font-weight:600;margin:0 0 14px}
.notify fieldset{border:0;padding:0;margin:0 0 18px;display:flex;flex-wrap:wrap;gap:10px 26px}
.notify legend{font-size:13px;color:var(--soft);padding:0;margin-bottom:10px}
.notify label{display:flex;align-items:center;gap:9px;font-size:16px;cursor:pointer}
.notify input[type=checkbox]{width:18px;height:18px;margin:0;accent-color:var(--sun)}
.notify-row{display:flex;flex-wrap:wrap;gap:10px;max-width:560px}
.notify input[type=email]{flex:1 1 240px;min-height:54px;padding:0 22px;border:1px solid var(--hair);border-radius:100px;background:none;color:var(--fg);font:16px InstrumentSans,Arial,sans-serif}
.notify input[type=email]:focus{border-color:var(--fg);outline:none}
.notify .button{border:0;cursor:pointer}
.notify-small{font-size:13px;color:var(--soft);margin:14px 0 0}
.notify-small a{margin-left:4px;text-underline-offset:3px}
.notify-done{font:26px/1.3 InstrumentSerif,Georgia,serif;margin:0}
.about{padding-block:80px 30px;max-width:none}
.about h2{font-size:34px;margin-bottom:12px}
.about p{font-size:16px;line-height:1.65;color:var(--soft);max-width:520px;margin:0}
.site-header nav .coffee-cta{display:inline-flex;align-items:center;gap:10px;height:40px;background:var(--sun);color:#211e1b;border-radius:100px;padding:0 4px 0 16px;font:600 13px InstrumentSans,Arial,sans-serif;text-decoration:none}
.coffee-cta b{display:grid;place-items:center;min-width:40px;height:32px;padding:0 10px 2px;background:#211e1b;color:#f7f4ec;border-radius:100px;font:400 19px/1 InstrumentSerif,Georgia,serif}
.coffee-cta i{font-style:normal}
.site-header nav .coffee-cta:hover{text-decoration:none}
.coffee-cta:hover b{background:#c8402a}
.coffee-cta:focus-visible,.prices a:focus-visible{outline:2px solid var(--fg);outline-offset:3px}
.coffee-page{padding-block:90px 120px;display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);gap:60px 80px;align-items:start}
.supporters{border-top:1px solid var(--hair);padding-top:22px;margin-top:14px}
.supporters h2{font-size:34px}
.supporters ol{list-style:none;margin:18px 0 0;padding:0;font:24px/1.5 InstrumentSerif,Georgia,serif}
.supporters-empty{color:var(--soft);font-style:italic}
.coffee-page h1{font-size:clamp(56px,7vw,104px);letter-spacing:-.04em;line-height:.95}
.coffee-lead{font:24px/1.4 InstrumentSerif,Georgia,serif;color:var(--soft);max-width:520px;margin:26px 0 0}
.prices{display:flex;gap:clamp(12px,3vw,26px);margin-top:52px}
.prices a{display:grid;place-items:center;width:clamp(96px,27vw,168px);aspect-ratio:1;padding-bottom:.08em;border-radius:50%;background:var(--sun);color:#211e1b;font:400 clamp(40px,10vw,72px)/1 InstrumentSerif,Georgia,serif;letter-spacing:-.01em;text-decoration:none;transition:transform .15s}
.prices a:hover{transform:scale(1.05);color:#c8402a}
.coffee-note{font-size:13px;color:var(--soft);margin:26px 0 0}
@media(prefers-reduced-motion:reduce){.prices a{transition:none}}
.landing .site-footer p{color:var(--soft)}

@media(max-width:860px){
  .coffee-page{grid-template-columns:1fr;padding-block:60px 80px}
  .landing .hero{grid-template-columns:1fr;gap:70px;padding-block:50px 80px}
  .block-wrap{width:min(84%,360px);order:-1}
  .words,.widget{grid-template-columns:1fr}
  .words{padding-block:80px}
  .phone-top{max-width:420px}
  .band{padding:80px 0}
}
@media(max-width:600px){
  .landing .site-header nav{gap:14px}
  .landing .site-header nav a[href^="#"]{display:none}
  .site-header nav .coffee-cta{text-transform:capitalize;padding-left:13px;gap:8px}
  .coffee-cta i{display:none}
  .landing .hero h1{font-size:clamp(56px,16vw,80px)}
  .stores .button{flex:1 1 100%}
  .rail{gap:20px;padding-inline:18px}
  .section-head p{font-size:20px}
  .wordlist tbody th{font-size:26px}
  .wordlist tbody th span{display:none}
  .landing .download h2{font-size:48px}
}
@media(prefers-reduced-motion:reduce){.landing,.leaf{transition:none}}
@media(max-width:380px){.landing .site-header nav a[href^="/privacy"]{display:none}}

/* The Kurdo home page: the apps, one card each */
.home-hero{padding-block:90px 70px}
.home-hero h1{font-size:clamp(56px,7.4vw,112px);line-height:.92;letter-spacing:-.045em;margin:0 0 30px;max-width:11ch}
.home-hero h1 em{font-style:italic;color:var(--sun)}
.landing[data-theme="light"] .home-hero h1 em{color:#c8402a}
.apps{display:grid;grid-template-columns:1fr 1fr;gap:clamp(20px,3vw,36px);padding-bottom:40px}
.app-card{display:flex;flex-direction:column;text-decoration:none;color:inherit;border-radius:28px;overflow:hidden;background:var(--bg-2);box-shadow:0 0 0 1px var(--hair);transition:box-shadow .3s}
.app-card:hover{box-shadow:0 0 0 1px var(--fg)}
.app-stage{height:clamp(320px,34vw,440px);display:flex;justify-content:center;align-items:flex-start;padding-top:56px;overflow:hidden}
.app-stage-pel{background:var(--sun)}
.app-stage-efrin{background:#173d38}
.landing[data-theme="light"] .app-stage-efrin{background:#2f6f5f}
.app-stage .phone{width:min(62%,280px);flex:none;border-radius:40px;transition:transform .5s cubic-bezier(.3,.7,.3,1)}
.app-stage .phone img{border-radius:34px}
.app-card:hover .app-stage .phone{transform:translateY(-14px)}
.app-meta{display:grid;grid-template-columns:56px 1fr auto;gap:20px;align-items:start;padding:30px clamp(22px,3vw,34px) 34px}
.app-meta>img{border-radius:13px}
.app-no{font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin:2px 0 8px}
.app-meta h2{font-size:clamp(40px,4vw,56px);line-height:1;letter-spacing:-.03em;margin-bottom:14px}
.app-meta p{font-size:16px;line-height:1.55;color:var(--soft);margin:0;max-width:440px}
.app-meta .app-status{display:flex;align-items:center;gap:9px;margin-top:20px;font-size:13px;font-weight:600;color:var(--fg)}
.dot{width:8px;height:8px;border-radius:50%;border:1px solid var(--soft)}
.dot-live{background:#5fb87a;border-color:#5fb87a}
.app-arrow{font:30px/1 InstrumentSerif,Georgia,serif;transition:transform .3s}
.app-card:hover .app-arrow{transform:translateX(6px)}
.about a{text-underline-offset:3px}

/* Efrîna Min: Pel's paper and night, the app's forest green in place of the sun */
.efrin{--sun:#e6c440;--forest:#173d38;--leaf:#2f6f5f}
.efrin .hero h1{font-size:clamp(54px,6.2vw,96px)}
.efrin .button-sun{background:var(--leaf);color:#f7f4ec}
.efrin .from-kurdo a{text-underline-offset:3px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;margin-block:0}
.stats div{border-top:1px solid var(--hair);padding-top:18px}
.stats dt{font-size:13px;font-weight:600;color:var(--soft);max-width:180px;line-height:1.4}
.stats dd{margin:22px 0 0;font:clamp(64px,7vw,104px)/.9 InstrumentSerif,Georgia,serif;letter-spacing:-.04em}
.features{padding-block:110px}
.feature-list{list-style:none;margin:70px 0 0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:56px clamp(28px,4vw,56px)}
.feature-list li{border-top:1px solid var(--fg);padding-top:18px}
.feature-no{font-size:12px;font-weight:600;letter-spacing:.15em;color:var(--sun)}
.landing[data-theme="light"] .feature-no{color:#c8402a}
.feature-list h3{font-size:clamp(30px,2.8vw,38px);letter-spacing:-.02em;margin:34px 0 12px}
.feature-list p{font-size:16px;line-height:1.6;color:var(--soft);margin:0;max-width:330px}
.names{display:grid;grid-template-columns:1fr minmax(280px,420px);gap:clamp(40px,7vw,100px);align-items:start}
.region-list tbody th{font-size:34px}
.region-list td{font:26px/1.2 'Geeza Pro','Noto Naskh Arabic',Tahoma,serif;text-align:right!important;color:var(--fg)!important;padding-right:0!important}
.region-list .ar-col{text-align:right}
.sources{padding-block:100px 20px}
.sources h2{font-size:34px;margin-bottom:12px}
.sources p{font-size:16px;line-height:1.65;color:var(--soft);max-width:680px;margin:0}
.efrin .download{background:var(--forest);color:#f7f4ec}
.efrin .download p,.efrin .download .store-note{color:#c9d6cf}
.efrin .button-dark{background:#f7f4ec;color:#173d38}
.efrin .button-line-dark{border-color:#f7f4ec;color:#f7f4ec}
.efrin .download :focus-visible{outline-color:#f7f4ec}

@media(max-width:860px){
  .apps,.names{grid-template-columns:1fr}
  .home-hero{padding-block:60px 50px}
  .stats{grid-template-columns:1fr 1fr;row-gap:44px}
  .feature-list{grid-template-columns:1fr 1fr}
  .features{padding-block:80px}
}
@media(max-width:600px){
  .landing .site-header nav .nav-apps{display:none}
  .home-hero h1{font-size:clamp(52px,15vw,76px)}
  .app-stage{height:340px;padding-top:40px}
  .app-meta{grid-template-columns:48px 1fr;gap:16px}
  .app-meta>img{width:48px;height:48px;border-radius:11px}
  .app-arrow{display:none}
  .feature-list{grid-template-columns:1fr;gap:44px}
  .feature-list h3{margin-top:24px}
  .region-list tbody th{font-size:28px}
  .region-list td{font-size:22px}
}
@media(prefers-reduced-motion:reduce){.app-stage .phone,.app-arrow{transition:none}}
.site-footer a{white-space:nowrap}
/* Efrîna Min: the screens, in a row */
.tour{padding-top:110px}
.tour .rail figure{width:min(64vw,250px)}
.tour .phone{border-radius:38px}
.tour .phone img{border-radius:32px}
.tour+.features{padding-top:70px}
.names .phones{grid-template-columns:repeat(2,minmax(0,210px))}
@media(max-width:860px){.tour{padding-top:80px}}
/* Home hero: the words and the places, side by side */
.home-hero{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(280px,1fr);align-items:center;gap:clamp(40px,6vw,90px)}
.home-hero h1{max-width:none}
.home-hero h1 em{white-space:nowrap}
.home-pair{position:relative;height:clamp(360px,34vw,470px)}
.pair-app{position:absolute;width:56%;display:flex;flex-direction:column;gap:18px;text-decoration:none;color:inherit;transition:transform .6s cubic-bezier(.3,.7,.3,1)}
.pair-app img{display:block;width:100%;height:auto;border-radius:22.5%;box-shadow:0 30px 60px #000a,0 0 0 1px var(--hair)}
.landing[data-theme="light"] .pair-app img{box-shadow:0 24px 50px #2b262240}
.pair-app span{font:italic 19px/1.3 InstrumentSerif,Georgia,serif;color:var(--soft)}
.pair-app b{font:600 13px InstrumentSans,Arial,sans-serif;font-style:normal;letter-spacing:.12em;text-transform:uppercase;color:var(--fg);margin-right:8px}
.pair-pel{left:0;top:0;transform:rotate(-7deg)}
.pair-efrin{right:0;bottom:0;transform:rotate(5deg)}
.home-pair:hover .pair-pel{transform:rotate(-9deg) translate(-6px,-6px)}
.home-pair:hover .pair-efrin{transform:rotate(7deg) translate(6px,6px)}
@media(max-width:860px){
  .home-hero{grid-template-columns:1fr}
  .home-pair{order:-1;width:min(100%,420px);height:min(92vw,400px);justify-self:center}
}
@media(max-width:600px){.pair-app span{font-size:16px}.home-hero h1 em{white-space:normal}}
@media(prefers-reduced-motion:reduce){.pair-app{transition:none}}
.home-hero h1{font-size:clamp(50px,5.7vw,88px)}
.home-hero{grid-template-columns:minmax(0,1.5fr) minmax(260px,1fr)}
@media(max-width:860px){.home-hero{grid-template-columns:1fr}.home-pair{width:min(100%,340px);height:min(84vw,340px)}}
@media(max-width:600px){.home-pair{width:min(80%,280px);height:min(72vw,270px)}.home-hero{padding-top:40px;gap:32px}}
.home-hero h1{font-size:clamp(42px,4.9vw,78px);margin-bottom:18px}
.hero-en{font:italic clamp(19px,1.7vw,23px)/1.4 InstrumentSerif,Georgia,serif;color:var(--soft);margin:0 0 34px}
.nobr{white-space:nowrap}@media(max-width:600px){.home-hero h1{font-size:clamp(40px,12vw,56px);line-height:.98}}
/* Efrîna Min's coffee button: the app's green in place of the sun */
.efrin .site-header nav .coffee-cta{background:var(--leaf);color:#f7f4ec}
.efrin[data-theme="light"] .site-header nav .coffee-cta{background:var(--forest)}
.efrin .coffee-cta b{background:#f7f4ec;color:#173d38}
.efrin .coffee-cta:hover b{background:#e6c440;color:#173d38}


/* Efrîna Min hero: the app's map (efrin.js). Colours are the app's palette and its dark mapping (index.tsx styles/darkStyles). */
.atlas-wrap{width:min(100%,400px);justify-self:center}
.atlas{--ink:#173D38;--secondary:#5F746C;--teal:#477D74;--orange:#B96E49;--olive:#718263;--oliveDark:#526345;--glass:#FFFDF8F2;--group:#F2F3EB;--divider:#D5DDD2;--line:#D6DDD2;--sel:#E8EDE5A6;--active:#526345;--active-ink:#FFFDF8;--shadow:#183A33;
  position:relative;aspect-ratio:2/3;container-type:size;border-radius:28px;overflow:hidden;background:#F5F2E9;box-shadow:0 30px 60px #0008,0 0 0 1px #f7f4ec14;color:var(--ink);font:15px/1.3 -apple-system,BlinkMacSystemFont,'SF Pro Text',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
.landing[data-theme="dark"] .atlas{--ink:#E8F1EA;--secondary:#A9BEB2;--teal:#A5D5C6;--orange:#E6A17C;--olive:#A2BB89;--oliveDark:#B9CDA1;--glass:#19382FF2;--group:#29483D;--divider:#49695C;--line:#39584C;--sel:#456659A6;--active:#285749;--active-ink:#E8F1EA;--shadow:#061910;background:#102720}
.landing[data-theme="light"] .atlas{box-shadow:0 24px 50px #2b262230,0 0 0 1px #2b26221a}
.atlas .atlas-map{position:absolute;inset:0;width:100%;height:100%}
.atlas .maplibregl-ctrl-attrib{font-size:10px}
.atlas button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.atlas-top{position:absolute;top:12px;left:12px;right:12px;display:flex;justify-content:space-between;align-items:flex-start;gap:10px;pointer-events:none}
.atlas-title,.atlas-lang{background:var(--glass);border-radius:15px;box-shadow:0 4px 12px color-mix(in srgb,var(--shadow) 10%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.atlas-title{min-height:44px;display:flex;align-items:center;padding:0 13px;font-size:20px;font-weight:700;letter-spacing:-.01em}
.atlas-lang{display:flex;padding:3px;pointer-events:auto}
.atlas-lang button{min-width:40px;min-height:38px;border:0;border-radius:11px;background:none;font-size:12px;font-weight:700;opacity:.55}
.atlas-lang button[aria-pressed="true"]{background:var(--sel);opacity:1}
.atlas-controls{position:absolute;right:12px;bottom:78px;display:flex;flex-direction:column;gap:8px;transition:opacity .2s}
.atlas-controls.covered{opacity:0;pointer-events:none}
.atlas-controls>button,.atlas-zoom{background:var(--glass);border:0;border-radius:22px;box-shadow:0 6px 18px color-mix(in srgb,var(--shadow) 14%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px)}
.atlas-controls>button{width:44px;height:44px;display:grid;place-items:center;padding:0}
.atlas-villages{align-content:center;gap:3px}
.atlas-villages .dots{display:flex;gap:3px;justify-content:center}
.atlas-villages i{width:4px;height:4px;border-radius:2px;background:var(--olive)}
.atlas-villages b{font-size:8px;font-weight:800;letter-spacing:.3px}
.atlas-villages[aria-pressed="true"]{background:var(--active)!important;color:var(--active-ink)}
.atlas-villages[aria-pressed="true"] i{background:var(--active-ink)}
.atlas-zoom{display:flex;flex-direction:column;overflow:hidden}
.atlas-zoom button{width:44px;height:42px;border:0;background:none;font-size:22px;font-weight:300;line-height:1}
.atlas-zoom button+button{border-top:1px solid var(--divider)}
.atlas-scope svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
.atlas-scope svg circle+circle{fill:currentColor;stroke:none}
.atlas-sheet{position:absolute;left:10px;right:10px;bottom:10px}
.atlas-sheet .pill{display:flex;align-items:center;gap:10px;width:100%;height:56px;padding:0 20px;border:0;border-radius:28px;background:var(--glass);box-shadow:0 -4px 18px color-mix(in srgb,var(--shadow) 15%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);font-size:16px;text-align:start}
.atlas-sheet .pill span:last-child{font-size:15px;font-weight:600}
.atlas-sheet .mag{flex:none;width:15px;height:15px;border:2px solid var(--secondary);border-radius:50%;position:relative;margin-right:2px}
.atlas-sheet .mag::after{content:"";position:absolute;width:2px;height:6px;background:var(--secondary);right:-4px;bottom:-5px;transform:rotate(-45deg);border-radius:1px}
.atlas-sheet .card{max-height:46cqh;overflow:auto;overscroll-behavior:contain;padding:18px 18px 16px;border-radius:26px;background:var(--glass);box-shadow:0 -4px 18px color-mix(in srgb,var(--shadow) 15%,transparent);-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);scrollbar-width:none}
.atlas-sheet input{flex:1;min-width:0;height:100%;border:0;background:none;color:var(--ink);font:inherit;font-size:16px;outline:none;-webkit-appearance:none;appearance:none}
.atlas-sheet input::placeholder{color:var(--secondary)}
.atlas-sheet p,.atlas-sheet h3{margin:0}
.atlas-sheet .head{display:flex;align-items:flex-start;gap:8px}
.atlas-sheet .head>div{flex:1;min-width:0}
.atlas-sheet .x{flex:none;width:32px;height:32px;border:0;border-radius:16px;background:var(--group);color:var(--secondary);font-size:18px;line-height:1}
.atlas-sheet h3{font:700 27px/1.1 -apple-system,BlinkMacSystemFont,system-ui,sans-serif;letter-spacing:-.01em}
.atlas-sheet .over{font-size:10px;font-weight:800;letter-spacing:1.2px;color:var(--teal);text-transform:uppercase;margin-bottom:4px}
.atlas-sheet .sub{font-size:15px;color:var(--secondary);margin-top:2px}
.atlas-sheet .actions{display:flex;gap:8px;margin-top:16px}
.atlas-sheet .actions a{flex:1;height:52px;display:grid;place-items:center;border-radius:14px;background:var(--group);color:var(--ink);font-size:12px;font-weight:600;text-decoration:none}
.atlas-sheet .statline{display:flex;margin:16px 0 2px}
.atlas-sheet .stat{flex:1;min-width:0;padding-right:10px}
.atlas-sheet .stat+.stat{border-left:1px solid var(--divider);padding-left:12px}
.atlas-sheet .lbl{font-size:11px;font-weight:600;letter-spacing:.4px;text-transform:uppercase;color:var(--secondary)}
.atlas-sheet .val{font-size:19px;font-weight:700;margin-top:3px}
.atlas-sheet .src{font-size:10px;color:var(--secondary);margin-top:1px}
.atlas-sheet .facts{display:flex;gap:8px;margin-top:14px}
.atlas-sheet .fact{flex:1;min-width:0;border-radius:13px;background:var(--group);padding:9px 11px}
.atlas-sheet .fact .lbl{font-size:10px;font-weight:700;letter-spacing:0;text-transform:none;color:var(--teal)}
.atlas-sheet .fact .val{font-size:21px;font-weight:800;margin-top:2px}
.atlas-sheet .fact .src{font-size:9px}
.atlas-sheet .section{font-size:20px;font-weight:700;margin:20px 0 9px}
.atlas-sheet .group{border-radius:16px;background:var(--group);overflow:hidden}
.atlas-sheet .group.about{padding:12px 14px;font-size:14px;line-height:1.45}
.atlas-sheet .row{display:flex;align-items:center;gap:12px;width:100%;padding:0 0 0 13px;border:0;background:none;text-align:start}
.atlas-sheet .pin{flex:none;width:30px;height:30px;border-radius:15px;background:var(--orange);position:relative}
.atlas-sheet .pin::after{content:"";position:absolute;left:11px;top:9px;width:8px;height:8px;border-radius:50%;background:#fff}
.atlas-sheet .txt{flex:1;min-width:0;min-height:58px;display:flex;flex-direction:column;justify-content:center;padding-right:8px}
.atlas-sheet .row+.row .txt,.atlas-sheet .row+.row .chev{border-top:1px solid var(--divider)}
.atlas-sheet .txt b{font-size:16px;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.atlas-sheet .txt small{font-size:13px;color:var(--secondary);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.atlas-sheet .chev{align-self:stretch;display:grid;place-items:center;padding-right:14px;color:var(--secondary);font-size:20px}
.atlas-sheet .results{margin-top:8px}
.atlas-sheet .empty{padding:18px;color:var(--secondary);font-size:14px;text-align:center}
.atlas-sheet .near{margin:18px 0 8px;color:var(--teal);font-size:9px;font-weight:800;letter-spacing:1.2px}
.atlas-sheet .center{display:flex;align-items:center;gap:10px;width:100%;min-height:42px;border:0;border-radius:11px;background:var(--group);padding:0 12px;text-align:start}
.atlas-sheet .cpin{width:10px;height:10px;border-radius:5px;background:var(--orange)}
.atlas-sheet .center b{flex:1;font-size:13px;font-weight:700}
.atlas-sheet .arrow{color:var(--orange);font-size:16px}
.atlas-sheet .places{display:flex;justify-content:space-between;align-items:center;width:100%;min-height:48px;margin-top:11px;padding:9px 0 0;border:0;border-top:1px solid var(--line);background:none;text-align:start}
.atlas-sheet .places b{display:block;font-size:12px;font-weight:700}
.atlas-sheet .places small{display:block;font-size:10px;color:var(--secondary);margin-top:2px}
.atlas.rtl .atlas-sheet{direction:rtl}
.atlas.rtl .atlas-sheet .stat+.stat{border-left:0;border-right:1px solid var(--divider);padding:0 12px 0 10px}
.atlas.rtl .atlas-sheet .row{padding:0 13px 0 0}
.atlas.rtl .atlas-sheet .chev{transform:scaleX(-1);padding:0 0 0 14px}
@media(max-width:860px){.atlas-wrap{order:-1;width:min(92%,400px)}}
.atlas input:focus-visible{outline:none}
/* the app's full-height sheets: search with the home overview, and a region's villages */
.atlas-sheet .card.tall{max-height:calc(100cqh - 76px);height:calc(100cqh - 76px)}
.atlas-sheet .card.search{max-height:calc(100cqh - 76px)}
.atlas-sheet .bar{display:flex;align-items:center;gap:10px;margin-bottom:14px;position:sticky;top:-18px;z-index:1}
.atlas-sheet .field{flex:1;height:44px;display:flex;align-items:center;gap:8px;border-radius:22px;padding:0 13px;background:var(--group)}
.atlas-sheet .field input{font-size:15px}
.atlas-sheet .clear{width:20px;height:20px;border:0;border-radius:10px;background:#81968B;color:#fff;font-size:13px;line-height:1;padding:0}
.atlas-sheet .x.big{width:44px;height:44px;border-radius:22px;color:var(--ink);font-size:20px}
.atlas-sheet .row strong{font-weight:800}
.atlas-sheet .ov-hero{min-height:85px;margin-top:-6px;display:flex;align-items:center;justify-content:space-between}
.atlas-sheet .ov-hero img{width:125px;height:95px;object-fit:contain;margin-right:-5px}
.atlas-sheet .olive{color:var(--oliveDark);font-size:12px;font-weight:600;margin-top:2px!important}
.atlas-sheet .ov-stats{display:flex;align-items:center;margin-top:3px}
.atlas-sheet .ov-stats div{flex:1;min-width:0}
.atlas-sheet .ov-stats b{display:block;font-size:20px;font-weight:700}
.atlas-sheet .ov-stats small{display:block;font-size:10px;color:var(--secondary);margin-top:1px}
.atlas-sheet .ov-stats i{width:1px;height:29px;background:var(--divider);margin:0 8px}
.atlas-sheet .ov-src{font-size:9px;color:var(--secondary);margin-top:9px!important}
.atlas-sheet .privacy{display:block;width:max-content;margin:16px auto 4px;color:var(--teal);font-size:12px;font-weight:700;text-decoration:none}
.atlas-sheet h3.big{font-size:34px}
.atlas-sheet .sub.small{font-size:14px}
.atlas-sheet .note{font-size:11px;line-height:16px;color:var(--secondary);margin:4px 0 10px!important}
.atlas-sheet .tile{display:flex;align-items:center;justify-content:space-between;width:100%;margin-top:11px;padding:11px 16px;border:0;border-radius:12px;background:var(--group);text-align:start}
.atlas-sheet .tile b{display:block;font-size:15px;font-weight:700}
.atlas-sheet .tile small{display:block;font-size:11px;color:var(--secondary);margin-top:2px}
.atlas-sheet .center-tile{padding:14px 16px;border-radius:13px}
.atlas-sheet .center-tile small{color:var(--teal);font-size:10px;font-weight:700;margin:0 0 2px}
.atlas-sheet .center-tile b{font-size:16px}
.atlas-sheet .tile .arrow{font-size:18px}
.atlas.rtl .atlas-sheet .ov-hero img{margin:0 0 0 -5px;transform:scaleX(-1)}
/* Pel's finger: shows where to tap until the map has been touched */
.atlas .finger{position:absolute;left:0;top:0;width:54px;height:69px;z-index:3;pointer-events:none;opacity:0;transform-origin:27px 4px;transition:transform .8s cubic-bezier(.3,.7,.3,1),opacity .3s;filter:drop-shadow(0 6px 10px #0005)}
.atlas .finger.on{opacity:1}
.atlas .finger.press path{transform:scale(.9);transform-origin:27px 6px;transition:transform .15s}
.atlas .finger path{transition:transform .2s}
@media(prefers-reduced-motion:reduce){.atlas .finger{display:none}}
.atlas .maplibregl-cooperative-gesture-screen{display:none}
/* Liquid Glass gives the app's controls their edge; on the web a fine rim and a deeper shadow do it */
.atlas{--rim:#183A331f;--lift:0 6px 18px #183A3326}
.landing[data-theme="dark"] .atlas{--glass:#24493ef2;--rim:#E8F1EA2e;--lift:0 8px 22px #0009}
.atlas-title,.atlas-lang,.atlas-controls>button,.atlas-zoom,.atlas-sheet .pill,.atlas-sheet .card{box-shadow:0 0 0 1px var(--rim),var(--lift)!important}
.landing[data-theme="dark"] .atlas-sheet .field,.landing[data-theme="dark"] .atlas-sheet .group,.landing[data-theme="dark"] .atlas-sheet .fact,.landing[data-theme="dark"] .atlas-sheet .actions a,.landing[data-theme="dark"] .atlas-sheet .x,.landing[data-theme="dark"] .atlas-sheet .center,.landing[data-theme="dark"] .atlas-sheet .tile{background:#33594c}
.atlas :focus-visible{outline:2px solid var(--orange);outline-offset:2px}
.atlas :focus:not(:focus-visible){outline:none}
.app-stage .leaf-shot{width:min(62%,280px);height:auto;flex:none;box-shadow:0 22px 50px #0006;transition:transform .5s cubic-bezier(.3,.7,.3,1)}
.app-card:hover .app-stage .leaf-shot{transform:translateY(-14px)}
@media(prefers-reduced-motion:reduce){.app-stage .leaf-shot{transition:none}}
.landing .hero{row-gap:36px}
.app-name img{border-radius:9px}
.app-name{grid-column:1;grid-row:1;align-self:end;display:flex;align-items:center;gap:14px;margin:0;font:600 16px InstrumentSans,Arial,sans-serif}
.landing .hero>.hero-copy{grid-column:1;grid-row:2;align-self:start}
.landing .hero>.block-wrap,.landing .hero>.atlas-wrap{grid-column:2;grid-row:1/3}
@media(max-width:860px){
  .app-name,.landing .hero>.hero-copy,.landing .hero>.block-wrap,.landing .hero>.atlas-wrap{grid-column:auto;grid-row:auto}
  .app-name{order:-2}
  .landing .hero>.hero-copy{margin-top:34px}
}
.landing .store-button{justify-content:flex-start;gap:12px;padding-inline:22px 28px;text-align:left}
.store-button svg{flex:none}
.store-button span{display:flex;flex-direction:column;font-size:17px;line-height:1.1}
.store-button small{font-size:11px;font-weight:500;opacity:.75}
.store-button small b{font-weight:inherit}
.store-button:not([href]) .live,.store-button[href] .soon{display:none}
@media(max-width:600px){.landing .store-button{justify-content:center}}
.efrin .stores{display:grid;grid-template-columns:repeat(2,max-content)}
@media(max-width:600px){.efrin .stores{grid-template-columns:1fr}}