@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;src:url(/web/content/4576/font-0.woff2?unique=cc8f89edb8) format('woff2');}@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:500;font-display:swap;src:url(/web/content/4577/font-1.woff2?unique=adf39537ff) format('woff2');}@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;src:url(/web/content/4578/font-2.woff2?unique=a170d4bdef) format('woff2');}@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:700;font-display:swap;src:url(/web/content/4579/font-3.woff2?unique=bddd84e08c) format('woff2');}
:root{--lime:#d6ff4d;--ink:#17231b;--paper:#f7f9f1;--muted:#626d5c;--line:#dce2d3;font-family:'IBM Plex Sans Arabic',sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,textarea,select{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{cursor:pointer;color:inherit}a{color:inherit;text-decoration:none}button{border:0}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid #759719;outline-offset:5px}button:disabled{cursor:wait}button,h1,h2,h3,p{margin:0}h1,h2,h3{font-weight:600}button{background:none}a:hover,.text-button:hover{color:#608000}[hidden]{display:none!important}.skip{position:fixed;top:-100px;background:white;padding:15px;z-index:100}.skip:focus{top:0}header{position:absolute;inset:0 0 auto;z-index:20;height:98px;display:flex;align-items:center;justify-content:space-between;padding:20px 5vw;border-bottom:1px solid #17231b12;gap:20px}.brand{display:flex;align-items:center;gap:18px}.brand img{width:72px;height:46px;object-fit:contain;filter:brightness(0)}.brand>span{font:14px/1.5 sans-serif;letter-spacing:3px;border-right:1px solid #bac4b2;padding-right:18px}.brand small{display:block;letter-spacing:0;font:12px/1.5 'IBM Plex Sans Arabic';margin-top:4px}.contact,.text-button{font-size:14px}.contact{border:1px solid #ccd4c3;border-radius:30px;padding:10px 18px}.text-button{margin-inline-start:auto}.eyebrow{font-size:13px;letter-spacing:.02em;font-weight:500;color:var(--muted);margin-bottom:10px}em{font-style:normal;color:#557509}h1{font-size:clamp(36px,4.6vw,70px);line-height:1.35;letter-spacing:-.035em}#atmosphere{position:fixed;inset:0;pointer-events:none;z-index:-1;opacity:.55}#atmosphere canvas{display:block;width:100%;height:100%}.view{min-height:100svh;position:relative;overflow:hidden}.home{padding-top:120px;display:flex;align-items:center;flex-direction:column;background:radial-gradient(ellipse at 50% 72%,#dbf99c66,transparent 49%)}.home-copy{text-align:center;position:relative;z-index:3}.home-copy h1{font-size:clamp(30px,3.3vw,49px)}.home-copy>p:last-child{color:var(--muted);font-size:16px;margin-top:7px}.mascot-stage{width:min(1380px,100%);height:min(60vw,600px);min-height:430px;position:relative;perspective:1200px;margin-top:-15px;transform-origin:50% 60%;will-change:transform,opacity;isolation:isolate}#hero-mascot{position:absolute;width:68%;height:100%;object-fit:contain;left:16%;bottom:0;filter:drop-shadow(0 30px 25px #2a44191a);pointer-events:none;z-index:2;animation:breathe 7s ease-in-out infinite}.orbit{position:absolute;left:26%;top:13%;width:48%;height:70%;border:1px solid #b6ce9466;border-radius:50%;transform:rotateX(60deg) rotateZ(-20deg);z-index:0}.orbit-b{transform:rotateX(60deg) rotateZ(30deg);top:27%;border-color:#b6ce9433}.portal{position:absolute;top:21%;width:25%;z-index:4;text-align:center;padding:18px 10px;border-radius:24px;transition:transform .35s,background .35s}.portal:hover{background:#ffffffb3;transform:translateY(-5px)}.portal-photo{right:1.5%}.portal-music{left:1.5%}.portal-kicker{display:block;font-size:12px;color:var(--muted);margin-bottom:5px}.portal strong{font-size:25px;font-weight:600;display:block;margin-bottom:10px}.portal>span:not(.portal-kicker){font-size:15px;line-height:1.8;display:block}.portal .portal-action{font-size:13px!important;font-weight:600;margin-top:14px}.object-hit{position:absolute;z-index:5;width:17%;height:30%;top:32%;border-radius:50%;transition:box-shadow .3s}.camera-hit{right:16%}.headphones-hit{left:16%}.object-hit:hover{box-shadow:0 0 0 2px #b7db6390,0 0 55px #d5ff4990}.bag-hit{position:absolute;left:50%;top:58%;transform:translateX(-50%);background:var(--lime);z-index:6;border:1px solid #ffffffba;border-radius:13px;padding:10px 20px;box-shadow:0 8px 26px #14221825;min-width:164px;text-align:center;transition:filter .25s}.bag-hit:hover{filter:brightness(1.07)}.bag-hit strong,.bag-hit span,.bag-hit i{display:block}.bag-hit strong{font-size:20px}.bag-hit span{font-size:12px}.bag-hit i{font-size:11px;font-style:normal;margin-top:5px}.home-footer{display:flex;justify-content:space-between;width:90%;color:var(--muted);font-size:12px;margin:auto 0 20px;gap:20px}.home-footer span[dir]{font-family:sans-serif;font-size:10px;letter-spacing:2px}.room{background:#eff3e8;min-height:100svh;padding:155px 7vw 130px;display:flex;flex-direction:column;justify-content:space-between}.room-art{position:absolute;inset:0;background-image:var(--room-image);background-size:cover;background-position:center;transform:scale(1.035) translate3d(var(--mx,0px),var(--my,0px),0);transition:transform 1.6s cubic-bezier(.2,.6,.2,1);will-change:transform;z-index:0}.room-shade{position:absolute;inset:0;background:linear-gradient(270deg,#f7f9f1f5 0%,#f7f9f1c9 28%,#f7f9f100 63%),linear-gradient(0deg,#f7f9f1f0 0%,transparent 42%);z-index:1}.room-copy{position:relative;z-index:2;width:43%;max-width:560px}.room-copy>p:last-child{font-size:18px;line-height:1.9;margin-top:20px;max-width:430px;color:#4c5b45}.room-choices{position:relative;z-index:3;display:grid;grid-template-columns:1fr 1fr;gap:18px;width:100%;margin-top:65px}.choice{display:flex;align-items:center;gap:22px;text-align:right;padding:28px 30px;border:1px solid #ffffffe0;background:#ffffffd9;backdrop-filter:blur(20px);border-radius:20px;box-shadow:0 10px 40px #15291d08;transition:transform .3s,background .3s}.choice:hover{transform:translateY(-5px);background:#edffc4}.choice-no{font:12px sans-serif;color:#75825e;align-self:flex-start;padding-top:8px}.choice h2{font-size:24px;line-height:1.5}.choice p{color:#667157;font-size:15px;margin-top:5px;line-height:1.7}.arrow{margin-right:auto;min-width:40px;height:40px;border-radius:50%;background:var(--lime);display:grid;place-items:center;font:22px sans-serif}.room-footnote{position:relative;z-index:2;font-size:12px;color:#6c775f;margin-top:14px}.world-nav{position:fixed;z-index:20;bottom:22px;left:50%;transform:translateX(-50%);border:1px solid #d5ddc7;background:#fffffff0;border-radius:40px;display:flex;gap:3px;padding:6px;box-shadow:0 5px 30px #20331512;backdrop-filter:blur(20px)}.world-nav a{padding:9px 20px;font-size:13px;white-space:nowrap;border-radius:25px}.world-nav a[aria-current]{background:var(--lime)}.community-room .room-art{filter:blur(2px);transform:scale(1.05)}.community-room .room-shade{background:linear-gradient(270deg,#f7f9f1e8,#f7f9f11a 75%),linear-gradient(0deg,#f7f9f1e0,transparent 60%)}#transition-veil{position:fixed;inset:0;z-index:40;background:#ecf8cf;opacity:0;visibility:hidden;pointer-events:none;display:grid;place-items:center}#transition-veil span{font-size:16px;letter-spacing:.04em}body.transitioning{overflow:hidden}body.transitioning header,body.transitioning .world-nav{pointer-events:none}dialog{border:1px solid #e4e9dc;border-radius:26px;padding:30px;width:min(730px,calc(100% - 28px));max-height:90svh;color:var(--ink);background:#fcfdf8;box-shadow:0 40px 150px #15251833;overscroll-behavior:contain}dialog::backdrop{background:#11201470;backdrop-filter:blur(12px)}dialog[open]{animation:dialog-in .3s ease-out}.wide-dialog{width:min(1000px,calc(100% - 28px))}.dialog-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:16px}.dialog-head h2{font-size:30px;line-height:1.45;letter-spacing:-.02em}.close{border:1px solid #dce2d4;background:#fff;border-radius:50%;min-width:42px;height:42px;font:27px sans-serif}.dialog-intro{font-size:16px;line-height:1.9;color:var(--muted);margin-bottom:22px}.service-options{display:grid;grid-template-columns:1fr 1fr;gap:16px}.service-options button{padding:25px;background:#f0f5e5;border-radius:16px;text-align:right;transition:background .2s}.service-options button:hover{background:#e2fbb1}.large-number{font:13px sans-serif;color:#6d795e;display:block;margin-bottom:28px}.service-options h3{font-size:23px}.service-options p{font-size:16px;color:var(--muted);line-height:1.9;margin:10px 0 25px}.link-label{font-size:14px;font-weight:600}.primary{background:var(--lime);display:inline-flex;align-items:center;justify-content:center;gap:20px;border:1px solid #bddb65;border-radius:50px;padding:14px 25px;font-size:16px;font-weight:600;line-height:1.6;transition:background .2s;white-space:normal}.primary:hover{background:#c7f22e}.comparison{position:relative;aspect-ratio:1.8;overflow:hidden;border-radius:18px;background:white;direction:ltr}.comparison>img,.before-layer img{width:100%;height:100%;object-fit:contain;display:block}.before-layer{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--split)) 0 0);background:#ededeb}.comparison input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;margin:0;z-index:4;direction:ltr}.comparison:focus-within{outline:3px solid #83a339;outline-offset:3px}.compare-label{position:absolute;top:14px;padding:5px 15px;background:#ffffffee;border-radius:20px;font-size:14px;z-index:2}.before-label{left:14px}.after-label{right:14px}.compare-line{position:absolute;top:0;bottom:0;left:var(--split);width:2px;background:white;box-shadow:0 0 8px #0004;pointer-events:none;z-index:3}.compare-line span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);border:3px solid white;background:var(--lime);width:44px;height:44px;border-radius:50%;display:grid;place-items:center;font:23px sans-serif}.compare-bottom{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-top:20px}.compare-bottom>p{font-size:14px;line-height:1.8;color:var(--muted);max-width:55%}.videos{display:grid;grid-template-columns:1fr 1fr;gap:22px}.video-frame{aspect-ratio:16/9;background:#152118;border-radius:16px;overflow:hidden}.video-frame>button{display:block;width:100%;height:100%;position:relative;padding:0}.video-frame img{width:100%;height:100%;object-fit:cover;opacity:.85}.video-frame button span{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);background:var(--lime);width:55px;height:55px;display:grid;place-items:center;border-radius:50%;padding-left:3px}.video-frame iframe{width:100%;height:100%;border:0}.videos h3{font-size:20px;margin-top:10px}.videos a{font-size:13px;display:inline-block;margin-top:5px;text-decoration:underline;text-underline-offset:4px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-bottom:18px}label{display:flex;flex-direction:column;gap:8px;font-size:14px;position:relative}label>span:not(.upload-label span){display:contents;color:#748546}label small{font-size:12px;color:#7a8371;position:absolute;left:0;top:0}input:not([type=range]),select,textarea{border:1px solid #d7decf;border-radius:11px;background:white;color:var(--ink);padding:12px 14px;width:100%;font-size:16px;min-height:48px}input::placeholder,textarea::placeholder{color:#969d8d;font-size:14px}textarea{resize:vertical;min-height:100px;max-height:300px}form .details-label{margin-bottom:20px}.privacy-note,.upload-note{font-size:13px;color:var(--muted);line-height:1.9;margin:14px 0}.submit-request{width:100%;margin-top:5px}#request-status{font-size:14px;line-height:1.9;margin-top:15px;color:#456321}.quiet-link{display:block;text-decoration:underline;font-size:14px;margin-top:8px}.upload-label{padding:20px;border:1px dashed #91ab69;border-radius:13px;background:#f3f9e9}.upload-label>span{font-size:12px;color:var(--muted)}.upload-label input{padding:10px;font-size:13px}.file-preview{display:flex;align-items:center;gap:15px;padding:15px 0;font-size:13px;overflow-wrap:anywhere}.file-preview img{width:80px;height:65px;object-fit:contain;border-radius:8px;background:#f0f2ec}.file-preview button{font-size:12px;text-decoration:underline;min-width:75px}.error{font-size:14px;color:#9a3122}.empty-state{padding:35px 20px;background:#eff5e4;border-radius:17px;text-align:center}.empty-state h3{font-size:24px;margin-bottom:12px}.empty-state p{font-size:16px;line-height:1.9;color:var(--muted);max-width:470px;margin:auto}.empty-state a{margin-top:22px}.noscript{position:fixed;inset:auto 0 0;background:#d6ff4d;padding:20px;text-align:center;z-index:50}@keyframes breathe{50%{transform:translateY(-7px)}}@keyframes dialog-in{from{opacity:0;transform:translateY(18px) scale(.98)}to{opacity:1;transform:none}}
@media(min-width:1450px){.mascot-stage{height:650px}.home{padding-top:145px}.home-footer{margin-top:0}}@media(max-width:1000px){.portal strong{font-size:21px}.portal>span:not(.portal-kicker){font-size:13px}.portal{top:16%}.room{padding:140px 5vw 125px}.room-copy{width:50%}.choice{gap:12px;padding:23px 20px}.choice h2{font-size:21px}.choice p{font-size:14px}.arrow{min-width:32px;height:32px}.home-copy{padding:0 20px}}
@media(max-width:700px){header{height:78px;padding:15px 20px;gap:12px}.brand{gap:11px}.brand img{width:53px;height:37px}.brand>span{font-size:11px;padding-right:10px;letter-spacing:2px}.brand small{font-size:10px}.contact{font-size:11px;padding:8px 11px}.text-button{font-size:12px}.text-button:not([hidden])+.contact{display:none}.home{padding-top:106px;min-height:100svh}.home-copy .eyebrow{font-size:12px;margin-bottom:6px}.home-copy h1{font-size:30px;line-height:1.5;max-width:340px}.home-copy>p:last-child{font-size:13px;max-width:275px;margin:10px auto 0;line-height:1.8}.mascot-stage{height:480px;min-height:480px;margin-top:7px;width:100%;}#hero-mascot{width:116%;left:-8%;height:78%;top:65px;bottom:auto}.portal{top:5px;width:46%;padding:8px 3px}.portal-photo{right:3%}.portal-music{left:3%}.portal-kicker{font-size:10px}.portal strong{font-size:18px;margin-bottom:4px}.portal>span:not(.portal-kicker){font-size:12px;line-height:1.8}.portal .portal-action{font-size:11px!important;margin-top:6px}.camera-hit{right:2%;top:34%;width:28%;height:24%}.headphones-hit{left:2%;top:34%;width:28%;height:24%}.bag-hit{top:62%;min-width:140px;padding:9px 12px}.bag-hit strong{font-size:18px}.bag-hit span{font-size:11px}.bag-hit i{font-size:10px}.orbit{left:5%;width:90%;top:28%;height:55%}.home-footer{flex-direction:column;align-items:center;gap:8px;font-size:11px;margin-top:-10px;margin-bottom:18px}.home-footer span[dir]{font-size:9px}.room{min-height:100svh;padding:112px 20px 107px;justify-content:space-between}.room-copy{width:100%;max-width:400px}.room-copy h1{font-size:42px;line-height:1.3}.room-copy>p:last-child{font-size:15px;line-height:1.9;max-width:295px;margin-top:15px}.room-art{background-position:62% center}.music-room .room-art{background-position:58% center}.room-shade{background:linear-gradient(180deg,#f7f9f1d9 0%,#f7f9f19c 24%,#f7f9f100 50%,#f7f9f1f0 90%)}.room-choices{grid-template-columns:1fr;gap:10px;margin-top:140px}.choice{padding:18px;gap:12px;border-radius:17px}.choice h2{font-size:19px}.choice p{font-size:12px;margin-top:4px}.choice-no{font-size:10px}.room-footnote{font-size:11px;margin-top:12px}.world-nav{bottom:15px;padding:5px}.world-nav a{font-size:12px;padding:9px 15px}.community-room .room-shade{background:linear-gradient(180deg,#f7f9f1e0 0%,#f7f9f16b 43%,#f7f9f1e8 88%)}.community-choices .choice h2{font-size:18px}.community-choices{margin-top:160px}dialog{padding:23px 19px;border-radius:21px;max-height:92svh}.dialog-head{gap:12px}.dialog-head h2{font-size:25px}.dialog-head .eyebrow{font-size:11px}.close{min-width:36px;height:36px;font-size:25px}.dialog-intro{font-size:14px}.service-options{grid-template-columns:1fr;gap:12px}.service-options button{padding:20px}.large-number{margin-bottom:10px}.service-options h3{font-size:21px}.service-options p{font-size:14px;margin:8px 0 15px}.comparison{aspect-ratio:1.13}.compare-bottom{flex-direction:column;gap:14px;align-items:stretch}.compare-bottom>p{max-width:none;font-size:13px}.videos{grid-template-columns:1fr;gap:25px}.form-grid{grid-template-columns:1fr;gap:15px}.privacy-note,.upload-note{font-size:12px}.empty-state{padding:25px 13px}.empty-state p{font-size:14px}}
@media(max-width:380px){.home-copy h1{font-size:27px}.home-copy>p:last-child{font-size:12px}.mascot-stage{height:430px;min-height:430px}.portal strong{font-size:16px}.portal>span:not(.portal-kicker){font-size:11px}.bag-hit{top:64%}.room-copy h1{font-size:37px}.room-choices{margin-top:110px}.choice{padding:15px}.choice h2{font-size:18px}.choice p{font-size:11px}.world-nav a{padding:8px 12px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.room-art{transform:none!important}}
#hero-mascot{scale:-1 1}
/* Keep labels outside the photographed props and preserve the full mascot on phones. */
@media(min-width:701px){.portal{top:-3%;width:26%}.portal-photo{right:0}.portal-music{left:0}}
body[data-room]:not([data-room=home]) header{background:#f7f9f1bd;backdrop-filter:blur(12px)}
h1[tabindex="-1"]:focus{outline:none}
@media(max-width:700px){#hero-mascot{width:100%;height:auto;left:0;top:140px}.bag-hit{top:59%;min-width:128px;padding:8px 10px}.bag-hit strong{font-size:16px}.bag-hit i{font-size:10px}.camera-hit{top:36%;height:23%;right:0}.headphones-hit{top:39%;height:26%;left:0}.music-room .room-art{background-position:29% center}.community-room .room-art{background-position:48% center}.room-shade{background:linear-gradient(180deg,#f7f9f1f2 0%,#f7f9f1cd 24%,#f7f9f120 48%,#f7f9f1f0 90%)}}
@media(max-width:380px){#hero-mascot{top:137px}.bag-hit{top:64%;min-width:123px}.bag-hit strong{font-size:15px}}







/* ================= fitting the rooms page into Odoo =================
   The studio site still carries the August design layer, written for the
   classic page. Three of its rules paint the whole site dark:

     body, #wrapwrap            -> dark background, near-white text
     #wrapwrap h1..h5           -> near-white
     #wrapwrap p, #wrapwrap li  -> near-white at 80%

   This design is light by definition (:root sets paper and ink), and its own
   colour rules are class-based, so every one of them loses to those id-level
   selectors. The fix has two halves: hand the elements back to the cascade,
   then restate the sixteen colours this design actually asks for at a
   specificity that clears the old layer. No !important anywhere, and the old
   layer stays untouched because the classic page still depends on it. */

html body, html #wrapwrap{ background:#f7f9f1; color:#17231b; }
html body{ font-family:'IBM Plex Sans Arabic', sans-serif; }
html #wrapwrap a{ color:inherit; }

html #wrapwrap p, html #wrapwrap li{ color:inherit; }
html #wrapwrap h1, html #wrapwrap h2, html #wrapwrap h3,
html #wrapwrap h4, html #wrapwrap h5{ color:inherit; }

/* the design's own palette, restated so it wins again */
html #wrapwrap .eyebrow,
html #wrapwrap .portal-kicker,
html #wrapwrap .home-footer,
html #wrapwrap .dialog-intro,
html #wrapwrap .service-options p,
html #wrapwrap .compare-bottom>p,
html #wrapwrap .upload-note,
html #wrapwrap .upload-label>span,
html #wrapwrap .empty-state p{ color:var(--muted); }
html #wrapwrap .room-copy>p:last-child{ color:#4c5b45; }
html #wrapwrap .choice p{ color:#667157; }
html #wrapwrap .choice-no{ color:#75825e; }
html #wrapwrap .room-footnote{ color:#6c775f; }
html #wrapwrap .large-number{ color:#6d795e; }
html #wrapwrap #request-status{ color:#456321; }
html #wrapwrap .error{ color:#9a3122; }
html #wrapwrap .text-button:hover{ color:#608000; }

/* Measured live at 1024x768. The mascot box is anchored to the bottom of the
   stage, so the entry can never sit fully below the art on a short screen -
   the best reachable is an overlap limited to the shoes, with everything
   still inside the first screen. */
@media(max-height:820px) and (min-width:701px){
  .home{ padding-top:76px; }
  #hero-mascot{ height:88%; object-position:center top; }
  .bag-hit{ bottom:5%; }
}
@media(max-height:760px) and (max-width:700px){
  .home{ padding-top:84px; }
  #hero-mascot{ height:80%; object-position:center top; }
  .bag-hit{ bottom:5%; }
}
/* the third entry is not a bag the mascot carries */
.bag-hit{ top:auto; bottom:3%; }
@media(max-width:700px){ .bag-hit{ bottom:4%; min-width:150px; } }

/* Two contrast repairs, measured on the live page.
   A third one was tried and reverted: the play control looked like dark text
   on a dark poster, but the glyph actually sits inside a lime disc, so
   colouring it lime made it vanish. It reads correctly as it is. */
html #wrapwrap .large-number{ color:#5f6b52; }   /* was 4.35, now 5.33 */
html #wrapwrap small{ color:var(--muted); }      /* was 3.72, now 5.12 */

/* ==== bilingual block, rewritten by i18n/publish_assets.py ==== */

/* ---------- language pill + the English reading direction, studio ----------
   The studio is the light identity, so the pill borrows the outline of the
   WhatsApp link it sits next to. */
.lang-go{display:inline-flex;align-items:center;justify-content:center;
  min-width:40px;height:36px;padding:0 14px;border:1px solid #ccd4c3;border-radius:30px;
  font-size:14px;line-height:1;transition:background .2s,border-color .2s,color .2s}
html #wrapwrap a.lang-go{color:var(--ink)}
html #wrapwrap a.lang-go:hover,html #wrapwrap a.lang-go:focus-visible{
  color:var(--ink);background:var(--lime);border-color:#bddb65}
html[lang^="ar"] a.lang-go.to-ar{display:none!important}
html[lang^="en"] a.lang-go.to-en{display:none!important}
.lang-short{display:none}

/* the pill reads as part of the brand cluster, the same place it sits on the
   other two pages */

@media(max-width:700px){
  .lang-long{display:none}
  .lang-short{display:inline}
  .lang-go{min-width:33px;height:30px;padding:0 10px;font-size:12px}
  /* inside a room the narrow header drops the WhatsApp link; the pill now sits
     between it and the back button, so the old adjacent rule needs widening */
  header .text-button:not([hidden])~.contact{display:none}
}

html[lang^="en"] #wrap{direction:ltr}
html[lang^="en"] .brand>span{border-right:0;border-left:1px solid #bac4b2;
  padding-right:0;padding-left:18px}
html[lang^="en"] .choice{text-align:left}
html[lang^="en"] .service-options button{text-align:left}
html[lang^="en"] .arrow{margin-right:0;margin-left:auto}
html[lang^="en"] label small{left:auto;right:0}
@media(max-width:700px){
  html[lang^="en"] .brand>span{padding-right:0;padding-left:10px}
}

/* The camera, the headphones and the bag are parts of a photograph, so their
   hit areas and their labels stay exactly where the props are in both languages. */

/* ---------- what the backend holds, inside the community room ----------
   The next event and the community articles are rendered by the server into
   hidden blocks and moved in here by the script. Same light identity as the
   rest of the studio: ink on paper, lime only where an action lives. */
.feed-panel{display:flex;flex-direction:column;gap:18px;margin-bottom:22px}
.feed-lead{border:1px solid var(--line);border-radius:18px;padding:20px 22px;
  background:#fbfdf6;display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.feed-lead strong{font-size:21px;line-height:1.5;font-weight:600}
.feed-when{font-size:12px;color:var(--muted);letter-spacing:.02em}
html #wrapwrap a.feed-go{background:var(--lime);border:1px solid #bddb65;border-radius:40px;
  padding:11px 24px;font-size:15px;font-weight:600;margin-top:6px;color:var(--ink);
  transition:background .2s,transform .2s}
html #wrapwrap a.feed-go:hover{background:#e6ff9a;transform:translateY(-2px)}
.feed-list{display:flex;flex-direction:column;gap:2px}
html #wrapwrap a.feed-item{display:flex;flex-direction:column;gap:4px;padding:13px 14px;
  border-radius:13px;color:var(--ink);transition:background .2s}
html #wrapwrap a.feed-item:hover{background:#f0f5e5;color:var(--ink)}
.feed-item strong{font-size:16px;line-height:1.55;font-weight:500}
@media(max-width:700px){
  .feed-lead{padding:16px 16px;border-radius:15px}
  .feed-lead strong{font-size:18px}
  .feed-item strong{font-size:14px}
}
