:root{
  --bg:#FAF7F0; --bg2:#F0E9DA; --card:#FFFFFF; --ink:#211D16; --muted:#6E6455; --line:#E2D8C2;
  --terra:#26201A; --terra-d:#14100C; --onterra:#FBF3DF; --gold:#9A7B24; --gold-soft:#EFE3BC;
  --shadow:0 12px 32px rgba(35,28,15,.13); --radius:18px;
}
@media (prefers-color-scheme: dark){
  :root{ --bg:#121110; --bg2:#1B1915; --card:#221F1A; --ink:#F2ECDD; --muted:#A79D88; --line:#39342B; --shadow:0 12px 32px rgba(0,0,0,.5); --terra:#D3AC55; --terra-d:#BE9A45; --onterra:#241B04; --gold:#C9A44C; --gold-soft:#2E2510; }
}
*{box-sizing:border-box} html{scroll-behavior:smooth}
body{margin:0;font-family:'Tajawal',system-ui,sans-serif;background:var(--bg);color:var(--ink);line-height:1.7;overflow-x:clip}
.hero-grid>*,.studio-grid>*,.about-grid>*{min-width:0}
.hero h1,.hero p{overflow-wrap:break-word}
img{max-width:100%;display:block}
a{color:inherit}
h1,h2,h3{font-family:'Amiri',serif;line-height:1.35;margin:0}
.wrap{max-width:1180px;width:100%;margin:0 auto;padding:0 18px}
.btn{display:inline-flex;align-items:center;gap:8px;border:0;cursor:pointer;font-family:inherit;font-weight:800;font-size:15px;padding:12px 22px;border-radius:999px;background:var(--terra);color:var(--onterra);transition:.2s;text-decoration:none}
.btn:hover{background:var(--terra-d)} .btn.gold{background:var(--gold);color:#1E1704} .btn.gold:hover{filter:brightness(1.08)}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)} .btn.ghost:hover{border-color:var(--terra);color:var(--terra)}
.btn.small{padding:8px 16px;font-size:13.5px}
header{position:sticky;top:0;z-index:60;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav{display:flex;align-items:center;gap:14px;padding-top:12px;padding-bottom:12px;flex-wrap:wrap}
.brand{font-family:'Amiri',serif;font-size:22px;font-weight:700;display:flex;align-items:center;gap:10px}
.brand .dot{width:38px;height:38px;border-radius:50%;background:var(--terra);color:var(--onterra);display:grid;place-items:center;font-family:'Great Vibes',cursive;font-size:20px;padding-top:4px}
.nav nav{display:flex;gap:4px;flex-wrap:wrap;margin-inline-start:auto}
.nav nav a{text-decoration:none;font-weight:700;font-size:14.5px;padding:8px 12px;border-radius:999px}
.nav nav a:hover{background:var(--bg2)}
.cartbtn{position:relative;background:var(--ink);color:var(--bg);border:0;border-radius:999px;padding:10px 18px;font-family:inherit;font-weight:800;cursor:pointer;font-size:14.5px}
.cartbtn span{position:absolute;top:-7px;inset-inline-start:-7px;background:var(--terra);color:var(--onterra);min-width:22px;height:22px;border-radius:999px;display:grid;place-items:center;font-size:12px;padding:0 5px}
.hero{padding-top:24px;padding-bottom:6px}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:28px;align-items:center}
.hero-grid figure{min-width:0;max-width:100%}
.hero h1{font-size:clamp(34px,5.4vw,58px)}
.hero h1 em{color:var(--gold);font-style:normal}
.hero p{color:var(--muted);font-size:17px;max-width:34em}
.hero-cta{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.hero-img{border-radius:22px;overflow:hidden;box-shadow:var(--shadow);position:relative}
.hero-img img{width:100%;height:480px;object-fit:cover;object-position:center 30%}
.hero-img figcaption{position:absolute;bottom:0;right:0;left:0;padding:38px 18px 12px;background:linear-gradient(transparent,rgba(20,12,4,.72));color:#FFF6E3;font-size:14px}
.sig{font-family:'Great Vibes',cursive;color:var(--gold);font-size:30px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:20px 0 4px}
.stat{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:16px;text-align:center}
.stat b{font-size:24px;display:block;font-family:'Amiri',serif}
.stat small{color:var(--muted)}
section{padding:30px 0}
.sec-head{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.sec-head h2{font-size:clamp(26px,3.6vw,38px)}
.sec-head p{color:var(--muted);margin:4px 0 0;max-width:44em}
.filters{display:flex;gap:8px;flex-wrap:wrap}
.chip{border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:8px 18px;font-family:inherit;font-weight:700;cursor:pointer;font-size:14px}
.chip.on{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.pcard{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 4px 14px rgba(60,40,15,.06)}
.pcard .ph{aspect-ratio:4/4.4;overflow:hidden;background:var(--bg2)}
.pcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.pcard:hover .ph img{transform:scale(1.04)}
.pcard .pb{padding:16px;display:flex;flex-direction:column;gap:6px;flex:1}
.pcard h3{font-size:21px}
.meta{color:var(--muted);font-size:13.5px}
.price{font-weight:900;font-size:19px;color:var(--terra)}
.price small{font-size:12.5px;color:var(--muted);font-weight:500}
.pactions{display:flex;gap:8px;flex-wrap:wrap;margin-top:auto;padding-top:10px}
/* ===== Trust strip under hero ===== */
.truststrip{background:var(--bg2);border-block:1px solid var(--line);padding:9px 0}
.truststrip .in{display:flex;align-items:center;justify-content:center;gap:10px 14px;flex-wrap:wrap;text-align:center;font-size:13.5px;font-weight:700;color:var(--ink)}
.truststrip .sep{color:var(--gold);font-size:11px}
/* ===== Share row on painting cards ===== */
.sharerow{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:11px;padding-top:10px;border-top:1px dashed var(--line)}
.sharerow .slab{font-size:12.5px;font-weight:800;color:var(--muted)}
.sharebtn{display:inline-flex;align-items:center;gap:4px;border:1.5px solid var(--gold);background:transparent;color:var(--ink);border-radius:999px;padding:4px 11px;font-family:inherit;font-weight:700;font-size:12.5px;cursor:pointer;text-decoration:none;line-height:1.5;transition:.15s}
.sharebtn:hover{background:var(--gold-soft)}
.sharebtn.copied{background:var(--gold);color:#1E1704}
.tag{align-self:flex-start;background:var(--gold-soft);color:#7A5E10;border-radius:999px;font-size:12px;font-weight:800;padding:2px 10px}
@media (prefers-color-scheme: dark){.tag{color:#E9CE7A}}
/* ===== Studio ===== */
.studio{background:var(--bg2);border-block:1px solid var(--line)}
.studio-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px;align-items:start}
.wallbox{border-radius:20px;overflow:hidden;box-shadow:var(--shadow);border:1px solid var(--line)}
.wall{position:relative;height:520px;transition:background .3s;overflow:hidden}
.wall img.room{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.wall .framed{z-index:3}
.wall .walllabel{z-index:4}
.wall .floor{position:absolute;bottom:0;right:0;left:0;height:19%}
.wall .sofa{position:absolute;bottom:12%;right:50%;transform:translateX(50%);width:62%;height:64px;border-radius:14px 14px 6px 6px;opacity:.92}
.wall .sofa::before{content:"";position:absolute;top:-30px;right:6%;left:6%;height:36px;border-radius:12px;background:inherit;filter:brightness(.92)}
.wall .plant{position:absolute;bottom:15%;inset-inline-start:6%;font-size:44px}
.framed{position:absolute;transition:width .2s;line-height:0;cursor:grab;touch-action:none;-webkit-user-select:none;user-select:none;--thick:1;--mw:9px;border:calc(var(--fb,0px)*var(--thick)) solid transparent;border-image:var(--fbi,none) 1;padding:var(--mw);background:var(--matbg,#FBF7EC)}
.framed:active{cursor:grabbing}
.framed.gest{transition:none}
.rsz{position:absolute;width:38px;height:38px;border-radius:50%;background:var(--gold);color:#1E1704;border:2.5px solid #FBF3DF;box-shadow:0 4px 12px rgba(20,12,2,.45);display:grid;place-items:center;cursor:nwse-resize;touch-action:none;z-index:6;padding:0;font-family:inherit;bottom:calc(-1 * var(--fb,0px) * var(--thick,1) - 19px);inset-inline-end:calc(-1 * var(--fb,0px) * var(--thick,1) - 19px)}
.rsz:active{filter:brightness(1.12)}
.rsz svg{width:20px;height:20px;pointer-events:none;display:block}
.framed img{-webkit-user-drag:none;pointer-events:none}
.framed img{width:100%;height:auto}
/* ===== Photorealistic layered frames — carved moulding profile, directional light, mat, recessed art ===== */
.f-gold-ornate{--fb:26px;--fbi:repeating-linear-gradient(45deg,#A87E1F 0 9px,#E9CE7C 9px 13px,#8A6414 13px 22px,#DDBB55 22px 26px,#77570F 26px 34px,#C49A35 34px 38px);--rings:inset 0 0 0 2px rgba(70,48,4,.55),inset 0 0 0 5px rgba(250,230,160,.45),inset 0 0 0 9px rgba(90,62,8,.40),inset 0 0 0 14px rgba(240,214,130,.22),inset 0 0 0 20px rgba(70,48,4,.16);box-shadow:0 12px 22px rgba(20,12,2,.30)}
.f-gold{--fb:15px;--fbi:linear-gradient(135deg,#7C5C12 0%,#C49A35 18%,#F6E7B2 38%,#B98C22 55%,#E9CF7E 72%,#8F6B1D 88%,#6E510D 100%);--rings:inset 0 0 0 2px rgba(90,64,8,.45),inset 0 0 0 5px rgba(250,232,170,.40),inset 0 0 0 9px rgba(110,80,14,.28),inset 0 0 0 13px rgba(246,231,178,.20);box-shadow:0 10px 20px rgba(20,12,2,.28)}
.f-gold-antique{--fb:17px;--fbi:repeating-linear-gradient(115deg,#6B4E10 0 14px,#9A7B2E 14px 22px,#5A400B 22px 37px,#B08D3E 37px 45px,#54390A 45px 58px);--rings:inset 0 0 0 2px rgba(40,26,2,.6),inset 0 0 0 6px rgba(200,162,74,.30),inset 0 0 0 11px rgba(46,30,4,.35),inset 0 0 0 15px rgba(176,141,62,.22);box-shadow:0 10px 20px rgba(20,12,2,.30)}
.f-silver-ornate{--fb:22px;--fbi:repeating-linear-gradient(45deg,#8E939B 0 8px,#E8ECF1 8px 12px,#767C85 12px 20px,#C9CFD8 20px 24px,#5F656E 24px 31px,#D5DAE1 31px 35px);--rings:inset 0 0 0 2px rgba(40,44,50,.5),inset 0 0 0 5px rgba(255,255,255,.5),inset 0 0 0 9px rgba(70,76,84,.35),inset 0 0 0 15px rgba(230,235,242,.25),inset 0 0 0 20px rgba(50,55,62,.18);box-shadow:0 12px 22px rgba(10,10,14,.30)}
.f-silver{--fb:13px;--fbi:linear-gradient(135deg,#6E747D 0%,#C9CFD8 25%,#F2F4F7 45%,#9AA1AB 65%,#DDE2E9 82%,#5F656E 100%);--rings:inset 0 0 0 2px rgba(50,55,62,.4),inset 0 0 0 5px rgba(255,255,255,.45),inset 0 0 0 9px rgba(90,97,106,.28),inset 0 0 0 12px rgba(240,243,247,.25);box-shadow:0 10px 20px rgba(10,10,14,.26)}
.f-bronze{--fb:14px;--fbi:linear-gradient(135deg,#5E3418 0%,#A0662F 22%,#E0A868 42%,#7C4A20 60%,#C88A48 78%,#4A2A10 100%);--rings:inset 0 0 0 2px rgba(46,24,6,.5),inset 0 0 0 5px rgba(240,190,120,.4),inset 0 0 0 9px rgba(90,50,18,.3),inset 0 0 0 12px rgba(224,168,104,.22);box-shadow:0 10px 20px rgba(20,10,2,.28)}
.f-wood-dark{--fb:17px;--fbi:repeating-linear-gradient(93deg,#4A2C12 0 13px,#3A2110 13px 19px,#5C3A1A 19px 32px,#2C1A0A 32px 38px,#66421F 38px 50px);--rings:inset 0 0 0 2px rgba(12,6,2,.65),inset 0 0 0 6px rgba(150,100,55,.28),inset 0 0 0 11px rgba(16,8,3,.4),inset 0 0 0 15px rgba(140,95,50,.2);box-shadow:0 10px 20px rgba(15,8,2,.30)}
.f-wood{--fb:15px;--fbi:repeating-linear-gradient(93deg,#96652F 0 13px,#7C4E21 13px 19px,#B07C3C 19px 32px,#6D441C 32px 38px,#A5713A 38px 50px);--rings:inset 0 0 0 2px rgba(40,22,4,.5),inset 0 0 0 5px rgba(230,180,110,.35),inset 0 0 0 10px rgba(60,34,8,.3),inset 0 0 0 13px rgba(217,168,96,.22);box-shadow:0 10px 20px rgba(20,12,2,.28)}
.f-wood-light{--fb:13px;--fbi:repeating-linear-gradient(93deg,#D9BE8E 0 13px,#C6A872 13px 19px,#E7D2A4 19px 32px,#B99B62 32px 38px,#DEC491 38px 50px);--rings:inset 0 0 0 2px rgba(120,90,40,.4),inset 0 0 0 5px rgba(255,246,214,.5),inset 0 0 0 9px rgba(150,118,60,.28),inset 0 0 0 12px rgba(244,231,196,.3);box-shadow:0 10px 20px rgba(30,20,5,.24)}
.f-mahogany{--fb:15px;--fbi:repeating-linear-gradient(93deg,#5E2317 0 13px,#471A10 13px 19px,#74301E 19px 32px,#3A1409 32px 38px,#83391F 38px 50px);--rings:inset 0 0 0 2px rgba(20,6,2,.6),inset 0 0 0 5px rgba(200,110,70,.3),inset 0 0 0 10px rgba(30,10,4,.35),inset 0 0 0 13px rgba(176,106,68,.2);box-shadow:0 10px 20px rgba(18,5,2,.30)}
.f-black{--fb:12px;--fbi:linear-gradient(135deg,#0C0C0E 0%,#2E2E33 30%,#17171A 55%,#3A3A40 78%,#0A0A0C 100%);--rings:inset 0 0 0 2px rgba(0,0,0,.7),inset 0 0 0 5px rgba(140,140,150,.28),inset 0 0 0 9px rgba(0,0,0,.4),inset 0 0 0 11px rgba(90,90,100,.18);box-shadow:0 10px 20px rgba(0,0,0,.32)}
.f-black-thin{--fb:5px;--fbi:linear-gradient(135deg,#101013 0%,#3F3F45 40%,#17171A 70%,#050506 100%);--rings:inset 0 0 0 1px rgba(0,0,0,.7),inset 0 0 0 3px rgba(150,150,160,.3);box-shadow:0 8px 16px rgba(0,0,0,.30)}
.f-white{--fb:12px;--fbi:linear-gradient(135deg,#D9D2BE 0%,#FFFFFF 30%,#F1EBDA 55%,#E3DCC8 80%,#CFC7AE 100%);--rings:inset 0 0 0 2px rgba(150,138,105,.45),inset 0 0 0 5px rgba(255,255,255,.65),inset 0 0 0 9px rgba(160,148,112,.3),inset 0 0 0 11px rgba(255,255,255,.4);box-shadow:0 10px 20px rgba(30,25,10,.24)}
.f-none{--fb:0px;--fbi:none;--rings:none;box-shadow:0 18px 30px rgba(0,0,0,.28)}
.framed.f-none{padding:0;background:transparent}
.framed::before{content:"";position:absolute;inset:calc(-1*var(--fb,0px)*var(--thick,1));box-shadow:var(--rings,none);pointer-events:none}
.framed.f-none::before{display:none}
.framed::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(135deg,rgba(255,255,255,.09),rgba(255,255,255,0) 42%);box-shadow:inset 0 2px 7px rgba(59,42,4,.22),inset 0 0 0 1px rgba(59,42,4,.10),inset 0 -1px 3px rgba(59,42,4,.12)}
/* ===== Frame picker strip — miniature framed swatches, snap scroll ===== */
.fstrip{display:flex;gap:9px;overflow-x:auto;padding:8px 2px 12px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;max-width:100%}
.fgrp{flex:none;align-self:center;width:54px;text-align:center;font-weight:800;font-size:12px;color:var(--gold);line-height:1.45;border-inline-end:1.5px dashed var(--line);padding-inline-end:7px}
.fchip{flex:none;scroll-snap-align:start;background:var(--bg);border:1.5px solid var(--line);cursor:pointer;padding:7px 6px 6px;border-radius:14px;display:flex;flex-direction:column;align-items:center;gap:6px;width:80px;font-family:inherit;transition:.15s}
.fchip.on{border-color:var(--terra);background:var(--gold-soft);box-shadow:0 0 0 1.5px var(--terra)}
.fchip .fname{font-size:11px;font-weight:700;line-height:1.35;text-align:center;color:var(--ink)}
.fsw{display:block;width:56px;height:42px;border:calc(var(--fb,0px)*.45) solid transparent;border-image:var(--fbi,none) 1;padding:3px;background:var(--matbg,#FBF7EC);box-shadow:0 3px 7px rgba(35,25,5,.30);line-height:0}
.fsw.f-none{padding:0;background:transparent;box-shadow:none}
.fsw .fart{display:block;width:100%;height:100%}
/* ===== Wall colour presets / size presets / trust line ===== */
.cpresets{display:flex;gap:7px;flex-wrap:wrap;align-items:center;margin-top:12px}
.csw{width:30px;height:30px;border-radius:50%;border:2px solid var(--line);cursor:pointer;padding:0;flex:none}
.csw:active{transform:scale(1.12);border-color:var(--terra)}
.sizepresets{display:flex;gap:7px;flex-wrap:wrap;margin-top:10px}
.sizepresets .chip{padding:6px 13px;font-size:13px}
.trustline{display:inline-block;margin-top:12px;background:var(--gold-soft);color:#7A5E10;font-weight:800;font-size:13.5px;border-radius:999px;padding:7px 15px}
@media (prefers-color-scheme: dark){.trustline{color:#E9CE7A}}
/* ===== Decorated room scenes — CSS furniture silhouettes ===== */
.decorbox{position:absolute;inset:0;pointer-events:none;z-index:1}
.decorbox .dfloor{position:absolute;bottom:0;right:0;left:0;height:19%;box-shadow:inset 0 3px 0 rgba(0,0,0,.14)}
.fu{position:absolute}
.fu-rug{bottom:4.5%;right:50%;transform:translateX(50%);width:76%;height:8.5%;border-radius:50%;opacity:.5}
.fu-sofa{bottom:15%;right:50%;transform:translateX(50%);width:64%;height:12.5%;border-radius:10px 10px 5px 5px;box-shadow:0 6px 14px rgba(0,0,0,.18)}
.fu-sofa::before{content:"";position:absolute;top:-56%;right:3%;left:3%;height:60%;border-radius:10px;background:inherit;filter:brightness(.93)}
.fu-sofa::after{content:"";position:absolute;inset:10% 5%;background:linear-gradient(90deg,transparent 49%,rgba(0,0,0,.16) 49%,rgba(0,0,0,.16) 51%,transparent 51%);border-radius:5px}
.fu-desk{bottom:15%;right:50%;transform:translateX(50%);width:58%;height:3.4%;border-radius:3px;box-shadow:0 4px 8px rgba(0,0,0,.15)}
.fu-desk::before{content:"";position:absolute;top:100%;right:2.5%;width:3%;height:320%;background:inherit;filter:brightness(.75)}
.fu-desk::after{content:"";position:absolute;top:100%;left:2.5%;width:3%;height:320%;background:inherit;filter:brightness(.75)}
.fu-chair{bottom:5.5%;width:11.5%;height:17.5%}
.fu-chair::before{content:"";position:absolute;top:0;right:9%;left:9%;height:52%;background:inherit;border-radius:7px 7px 3px 3px;filter:brightness(.94)}
.fu-chair::after{content:"";position:absolute;bottom:24%;right:0;left:0;height:15%;background:inherit;border-radius:4px;filter:brightness(.78)}
.fu-table{bottom:10.5%;right:50%;transform:translateX(50%);width:47%;height:6%;border-radius:50%;box-shadow:0 5px 10px rgba(0,0,0,.16)}
.fu-table::before{content:"";position:absolute;top:72%;right:17%;width:2.6%;height:130%;background:inherit;filter:brightness(.72)}
.fu-table::after{content:"";position:absolute;top:72%;left:17%;width:2.6%;height:130%;background:inherit;filter:brightness(.72)}
.fu-pend{top:0;width:42px;height:26%}
.fu-pend::before{content:"";position:absolute;top:0;right:50%;transform:translateX(50%);width:2px;height:60%;background:rgba(40,32,20,.55)}
.fu-pend::after{content:"";position:absolute;bottom:2%;right:0;left:0;height:38%;background:linear-gradient(#3A352D,#24211C);clip-path:polygon(27% 0,73% 0,100% 100%,0 100%)}
.fu-floorlamp{bottom:13%;width:34px;height:36%}
.fu-floorlamp::before{content:"";position:absolute;bottom:0;right:50%;transform:translateX(50%);width:3px;height:76%;background:rgba(35,28,18,.6)}
.fu-floorlamp i{position:absolute;top:0;right:0;left:0;height:23%;background:linear-gradient(#F6E7B2,#D9B84E);clip-path:polygon(26% 0,74% 0,100% 100%,0 100%)}
.fu-shelf{top:14%;inset-inline-start:4.5%;width:21%;height:12%;background:repeating-linear-gradient(90deg,#7A4A2B 0 8%,#A03B2A 8% 15%,#2F5D50 15% 23%,#C9A227 23% 30%,#5B87AC 30% 38%,#7A4A2B 38% 47%,#8A5A2B 47% 55%,#A03B2A 55% 63%);border-bottom:6px solid #5E4126;border-radius:2px}
.fu-plant{bottom:13.5%;font-size:32px;line-height:1}
.ms-head{font-weight:900;font-size:15.5px;margin-bottom:6px}
.ms-trust{font-weight:700;font-size:12px;color:var(--gold);margin-top:2px}
.ms-colors{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.ms-colors .csw{width:26px;height:26px}
.ms-colorpick{position:relative;width:26px;height:26px;border-radius:50%;overflow:hidden;background:conic-gradient(#E4572E,#E9C33C,#2F8F6E,#1D5C8A,#7A4A9E,#E4572E);border:2px solid var(--line);flex:none;cursor:pointer}
.ms-colorpick input{position:absolute;inset:-6px;opacity:0;cursor:pointer;width:44px;height:44px;padding:0;border:0}
.wall .artshadow{position:absolute;background:rgba(20,12,3,.85);filter:blur(30px);z-index:2;border-radius:5px;pointer-events:none}
.wall .artshadow.mid{background:rgba(18,10,3,.9);filter:blur(12px)}
.wall .artshadow.near{background:rgba(13,7,2,.96);filter:blur(4px)}
.wall .castoverlay{position:absolute;z-index:4;pointer-events:none;opacity:0;transition:opacity .3s}
.shadowctl{display:flex;align-items:center;gap:10px;margin-top:12px;flex-wrap:wrap}
.shadowctl .shbtn{width:48px;height:48px;border-radius:50%;border:1.5px solid var(--line);background:var(--bg);color:var(--ink);font-size:19px;cursor:pointer;display:grid;place-items:center;flex:none;padding:0}
.shadowctl .shbtn:active{border-color:var(--terra);background:var(--gold-soft)}
.shadowctl input[type=range]{flex:1;min-width:110px}
.pcard .ph{cursor:pointer}
.walllabel{position:absolute;bottom:21%;inset-inline-end:14px;background:rgba(0,0,0,.45);color:#FFF3D6;border-radius:999px;padding:3px 12px;font-size:12.5px}
.controls{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:20px;display:flex;flex-direction:column;gap:18px}
.controls h3{font-size:19px;margin-bottom:8px}
.thumbs{display:flex;gap:8px;flex-wrap:wrap}
.thumbs button{border:2.5px solid transparent;border-radius:10px;padding:0;overflow:hidden;cursor:pointer;width:56px;height:56px;background:none}
.thumbs button.on{border-color:var(--terra)}
.thumbs img{width:100%;height:100%;object-fit:cover}
.swatches{display:flex;gap:8px;flex-wrap:wrap}
.sw{width:42px;height:42px;border-radius:50%;border:2.5px solid var(--line);cursor:pointer;padding:0}
.sw.on{border-color:var(--terra);transform:scale(1.1)}
.sw.room{width:68px;height:47px;border-radius:12px;background-size:cover;background-position:center}
.sw.room.on{transform:none;box-shadow:0 0 0 2px var(--terra)}
.sw.colorpick{position:relative;overflow:hidden;background:conic-gradient(#E4572E,#E9C33C,#2F8F6E,#1D5C8A,#7A4A9E,#E4572E)}
.sw.colorpick input{position:absolute;inset:-6px;opacity:0;cursor:pointer;width:60px;height:60px;padding:0;border:0}
.frames{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.frames button{border:1.5px solid var(--line);background:var(--bg);color:var(--ink);border-radius:12px;padding:10px;font-family:inherit;font-weight:700;cursor:pointer;font-size:13.5px;text-align:start}
.frames button.on{border-color:var(--terra);background:var(--gold-soft)}
input[type=range]{width:100%;accent-color:var(--terra)}
.upload{position:relative;border:2px dashed var(--line);border-radius:14px;padding:16px 14px;min-height:56px;display:flex;align-items:center;justify-content:center;text-align:center;cursor:pointer;font-weight:700;color:var(--muted);font-size:14.5px;-webkit-tap-highlight-color:rgba(46,75,63,.15)}
.upload:hover{border-color:var(--terra);color:var(--terra)}
.upload:active{border-color:var(--terra);color:var(--terra);background:var(--gold-soft)}
.upload.big{font-size:16.5px;font-weight:800;padding:20px 14px;border:2px solid var(--gold);color:var(--terra);background:var(--gold-soft);border-radius:16px}
.nav nav a.artistbtn{background:var(--gold);color:#1E1704;font-weight:900;box-shadow:0 4px 12px rgba(120,90,20,.30)}
.nav nav a.artistbtn:hover{background:var(--gold);filter:brightness(1.07)}
.upload input[type=file]{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer;margin:0;padding:0;border:0}
#camerawrap{display:none;position:relative;border-radius:14px;overflow:hidden;background:#000}
#camerawrap video{width:100%;height:260px;object-fit:cover}
#camerawrap img{position:absolute;top:12%;right:50%;transform:translateX(50%);width:34%;box-shadow:0 10px 24px rgba(0,0,0,.5)}
/* ===== About / forms ===== */
.about-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:26px;align-items:center}
.about-grid img{border-radius:20px;height:420px;width:100%;object-fit:cover;box-shadow:var(--shadow)}
form .row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
label{font-weight:700;font-size:14px;display:block;margin-bottom:5px}
input[type=text],input[type=tel],input[type=number],input[type=email],select,textarea{width:100%;border:1.5px solid var(--line);border-radius:12px;padding:11px 13px;font-family:inherit;font-size:15px;background:var(--card);color:var(--ink)}
textarea{resize:vertical}
.adminbox{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:22px}
.adminlist{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.adminlist .item{display:flex;align-items:center;gap:12px;border:1px solid var(--line);border-radius:12px;padding:8px 12px}
.adminlist img{width:46px;height:46px;object-fit:cover;border-radius:8px}
.adminlist .del{margin-inline-start:auto;background:none;border:0;color:#B3352B;font-weight:800;cursor:pointer;font-family:inherit}
/* drawer / modal / toast */
.drawer{position:fixed;inset:0;z-index:90;display:none}
.drawer.open{display:block}
.drawer .scrim{position:absolute;inset:0;background:rgba(15,10,4,.55)}
.drawer .panel{position:absolute;top:0;bottom:0;inset-inline-start:0;width:min(430px,94vw);background:var(--bg);padding:22px;overflow:auto;box-shadow:var(--shadow)}
.citem{display:flex;gap:12px;border:1px solid var(--line);border-radius:14px;padding:10px;margin-bottom:10px;background:var(--card)}
.citem img{width:64px;height:64px;object-fit:cover;border-radius:10px}
.citem .rm{margin-inline-start:auto;background:none;border:0;color:#B3352B;cursor:pointer;font-weight:800;font-family:inherit;height:fit-content}
.modal{position:fixed;inset:0;z-index:95;display:none;place-items:center;padding:16px}
.modal.open{display:grid}
.modal .scrim{position:absolute;inset:0;background:rgba(15,10,4,.6)}
.modal .box{position:relative;background:var(--bg);border-radius:20px;max-width:760px;width:100%;max-height:92vh;overflow:auto;padding:0}
.modal .box img{width:100%;max-height:52vh;object-fit:contain;background:var(--bg2)}
.modal .inner{padding:20px}
#toast{position:fixed;bottom:20px;right:50%;transform:translateX(50%) translateY(80px);background:var(--ink);color:var(--bg);padding:12px 22px;border-radius:999px;font-weight:800;z-index:120;transition:.3s;box-shadow:var(--shadow);max-width:92vw;text-align:center}
#toast.show{transform:translateX(50%) translateY(0)}
footer{border-top:1px solid var(--line);padding:34px 0 46px;background:var(--bg2)}
.success{display:none;background:#E7F2E9;border:1px solid #9CC7A6;color:#1E4D2A;border-radius:14px;padding:16px;font-weight:700}
/* ===== How to order / FAQ ===== */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.step{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:18px}
.step .n{width:34px;height:34px;border-radius:50%;background:var(--gold);color:#1E1704;font-weight:900;display:grid;place-items:center;font-size:17px}
.step h3{font-size:18px;margin:10px 0 4px}
.step p{color:var(--muted);margin:0;font-size:14.5px}
.assure{display:flex;gap:10px;flex-wrap:wrap;margin-top:16px}
.assure div{background:var(--gold-soft);color:#6D5510;border-radius:999px;padding:8px 16px;font-weight:800;font-size:14px}
@media (prefers-color-scheme: dark){.assure div{color:#E9CE7A}}
.faq{display:grid;gap:10px;max-width:840px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:14px 18px}
.faq summary{font-weight:800;cursor:pointer;font-size:16px}
.faq p{color:var(--muted);margin:8px 0 2px}
@media (prefers-color-scheme: dark){.success{background:#1D2E21;color:#A9D8B4;border-color:#33543C}}
/* ===== Folded info sections (accordions) — calm page: closed by default, one tap opens ===== */
section[id]{scroll-margin-top:84px}
.acc{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 4px 14px rgba(60,40,15,.06);overflow:hidden}
.acc-head{width:100%;display:flex;align-items:center;justify-content:space-between;gap:14px;background:none;border:0;cursor:pointer;font-family:'Amiri',serif;font-weight:700;font-size:clamp(23px,3.2vw,32px);line-height:1.35;color:var(--ink);padding:17px 22px;text-align:start;-webkit-tap-highlight-color:transparent}
.acc-head:active{background:var(--bg2)}
.acc-head .chev{flex:none;width:36px;height:36px;border-radius:50%;background:var(--gold-soft);color:var(--gold);display:grid;place-items:center;transition:transform .3s ease}
.acc.open .acc-head .chev{transform:rotate(180deg)}
.acc-body{display:grid;grid-template-rows:0fr;visibility:hidden;transition:grid-template-rows .35s ease,visibility 0s linear .35s}
.acc.open .acc-body{grid-template-rows:1fr;visibility:visible;transition:grid-template-rows .35s ease,visibility 0s}
.acc-inner{overflow:hidden;min-height:0}
.acc-pad{padding:2px 22px 22px}
.acc-lead{color:var(--muted);margin:0 0 16px}
/* ===== Reserved gallery slots ===== */
.slots{margin-top:20px}
.slotcard{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:16px;display:flex;flex-direction:column;gap:8px;box-shadow:0 4px 14px rgba(35,28,15,.07)}
.slotcard h3{font-size:20px}
.slotcard p{color:var(--muted);margin:0;font-size:14.5px;flex:1}
.slotframe{aspect-ratio:4/2.9;background:var(--bg2);border:1px solid var(--gold-soft);border-radius:12px;display:grid;place-items:center;color:var(--gold)}
.slotcard .btn{align-self:flex-start}
/* ===== Per-painting mini studio (preview only, on the visitor's own screen) ===== */
.ms{display:none;border-top:1px solid var(--line);margin:2px 16px 16px;padding-top:14px}
.ms.open{display:block}
.wall.mswall{height:290px;border-radius:14px}
.ms-sec{margin-top:12px}
.ms-t{font-weight:800;font-size:13.5px;margin-bottom:7px}
.ms-rooms{display:flex;gap:6px;flex-wrap:wrap}
.ms-rooms button{width:54px;height:40px;border-radius:9px;border:2.5px solid var(--line);background-size:cover;background-position:center;cursor:pointer;padding:0;background-color:var(--bg2)}
.ms-rooms button.on{border-color:var(--terra)}
.ms-frames button{font-size:12.5px;padding:8px 9px}
.ms-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
@media (max-width:560px){.wall.mswall{height:250px}}
@media (max-width:900px){
  .steps{grid-template-columns:repeat(2,1fr)}
  .hero-grid,.studio-grid,.about-grid{grid-template-columns:minmax(0,1fr)}
  .hero h1{font-size:32px}
  .hero p{font-size:16px;max-width:100%}
  .grid{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .hero-img img{height:340px}
  .wall{height:420px}
}
@media (max-width:560px){
  .steps{grid-template-columns:1fr}
  .grid{grid-template-columns:1fr}
  form .row{grid-template-columns:1fr}
  .nav nav{order:3;width:100%}
}