:root{--t:#0d9488;--td:#0f766e;--tl:#e6f7f5;--ink:#12302d;
--tex:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .05  0 0 0 0 .5  0 0 0 0 .45  0 0 0 .09 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
--hatch:repeating-linear-gradient(45deg,#00000014 0 1px,transparent 1px 5px)}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:Vazirmatn,Tahoma,sans-serif;background:#fff var(--tex);color:var(--ink);line-height:2;overflow-x:hidden}
a{text-decoration:none;color:inherit}
svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* background video + layers */
.bgvid{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;z-index:-4;background:#d9f3f0}
.veil{position:fixed;inset:0;z-index:-3;background:linear-gradient(90deg,#ffffff00 0%,#ffffff66 55%,#ffffffb0 100%),var(--tex);transition:background .4s}
body.late .veil{background:#ffffffd9}
.sketch{position:fixed;left:0;right:0;bottom:0;height:20vh;z-index:-2;pointer-events:none;
 -webkit-backdrop-filter:grayscale(1) contrast(1.5) brightness(1.15);backdrop-filter:grayscale(1) contrast(1.5) brightness(1.15);
 background:var(--hatch);-webkit-mask-image:linear-gradient(to top,#000 55%,transparent);mask-image:linear-gradient(to top,#000 55%,transparent)}
.bar{position:fixed;top:0;right:0;left:0;height:4px;z-index:30}
.bar i{display:block;height:100%;width:0;background:var(--t);border-radius:0 4px 4px 0}

/* vertical side nav (icons) */
.side{position:fixed;left:14px;top:50%;transform:translateY(-50%);z-index:40;display:flex;flex-direction:column;align-items:center;gap:6px;padding:10px 8px;background:#ffffffd9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid #0d94881f;border-radius:40px;box-shadow:0 8px 28px #0d948833}
.side a{position:relative;width:44px;height:44px;display:grid;place-items:center;border-radius:50%;color:var(--td);transition:transform .25s,background .25s}
.side a:hover{transform:scale(1.1);background:var(--tl)}
.side .logo{background:var(--t);color:#fff;margin-bottom:6px}
.side .logo:hover{background:var(--td)}
.side .cta{background:var(--t);color:#fff;margin-top:6px}
.side a[data-tip]::after{content:attr(data-tip);position:absolute;left:54px;top:50%;transform:translateY(-50%);white-space:nowrap;background:var(--td);color:#fff;font-size:.78rem;padding:0 12px;border-radius:20px;opacity:0;pointer-events:none;transition:.2s}
.side a:hover::after{opacity:1}

/* story */
.story{height:500vh;position:relative}
.sticky{position:sticky;top:0;height:100vh;display:flex;align-items:center;justify-content:flex-start;padding:40px 6vw 30px}
.texts{position:relative;width:min(460px,100%);height:300px}
.card{position:absolute;inset:0 0 auto 0;background:#ffffffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid #0d948833;border-radius:28px;padding:30px;box-shadow:0 14px 40px #0d94883a;opacity:0;transform:translateY(24px);transition:opacity .6s,transform .6s;pointer-events:none}
.card.active{opacity:1;transform:none;pointer-events:auto}
.card.active:hover{transform:scale(1.1)}
.tag{display:inline-block;background:var(--tl);color:var(--td);font-size:.8rem;padding:2px 14px;border-radius:20px;margin-bottom:10px}
h1{font-size:clamp(2rem,4.5vw,3.2rem);line-height:1.5}
h1 em{color:var(--t);font-style:normal}
h2{font-size:clamp(1.4rem,3vw,2rem);color:var(--td)}

/* sections */
.plain{padding:90px 6vw 90px calc(6vw + 76px);text-align:center;background:var(--tex),#ffffffe0;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}
.plain:nth-of-type(even){background:var(--tex),#e6f7f5ea}
.title{display:inline-block;font-size:clamp(1.6rem,3.5vw,2.4rem);color:var(--td);margin-bottom:8px;transition:transform .3s}
.title.big{display:block;font-size:clamp(2rem,5vw,3.4rem)}
.sub{opacity:.75;margin:0 auto 30px;max-width:640px;transition:transform .3s}
.title:hover,.sub:hover{transform:scale(1.1)}
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:22px;margin-top:30px}
.cards.five{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.box{background:#fff;border:1px solid #0d948833;border-radius:24px;padding:26px;box-shadow:0 10px 30px #0d94881f;transition:transform .3s,box-shadow .3s}
.box:hover{transform:scale(1.1);box-shadow:0 18px 44px #0d948844;position:relative;z-index:2}
.box h3{color:var(--t)}
.box b{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--t);color:#fff;margin-bottom:8px}
.wide{max-width:560px;margin:30px auto 0}
.info{margin-top:14px;color:var(--td);font-weight:700}
.more{display:inline-block;margin-top:34px;background:var(--t);color:#fff;padding:6px 26px;border-radius:30px;transition:transform .3s}
.more:hover{transform:scale(1.1)}
footer{margin-top:50px;opacity:.5;font-size:.85rem}

/* sketch photos: B/W until hover */
.shot{position:relative;border-radius:24px;overflow:hidden;border:5px solid #fff;box-shadow:0 12px 34px #0d948833;aspect-ratio:1/1;
 background-color:hsl(var(--h,170) 45% 70%);background-image:var(--img),linear-gradient(135deg,hsl(var(--h,170) 50% 80%),hsl(var(--h,170) 55% 45%));background-size:cover;background-position:center;
 filter:grayscale(1) contrast(1.35) brightness(1.08);transition:filter .6s,transform .4s,box-shadow .4s;cursor:pointer}
.shot::before{content:"";position:absolute;inset:0;background:var(--hatch),repeating-linear-gradient(-45deg,#00000010 0 1px,transparent 1px 7px);mix-blend-mode:multiply;transition:opacity .6s}
.shot figcaption{position:absolute;bottom:10px;right:10px;background:#ffffffe0;color:var(--td);font-size:.8rem;padding:0 14px;border-radius:20px}
.shot:hover,.shot.in{filter:none}
.shot:hover::before,.shot.in::before{opacity:0}
.shot:hover{transform:scale(1.1);z-index:3;box-shadow:0 20px 50px #0d948855}
.strip{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px}
.masonry{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:190px;gap:18px;grid-auto-flow:dense}
.masonry .shot{aspect-ratio:auto}
.masonry .tall{grid-row:span 2}
.masonry .span2{grid-column:span 2}

/* before/after */
.gal{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:24px}
.cmp{position:relative;aspect-ratio:4/3;border-radius:28px;overflow:hidden;border:6px solid #fff;box-shadow:0 14px 40px #0d948833;--p:50%}
.img{position:absolute;inset:0;background-size:cover;background-position:center}
.after{background-image:var(--b),linear-gradient(135deg,#5eead4,#0d9488)}
.before{background-image:var(--a),linear-gradient(135deg,#e7dcb4,#b8a56a);clip-path:inset(0 0 0 calc(100% - var(--p)))}
.cmp input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:ew-resize;z-index:3}
.line{position:absolute;top:0;bottom:0;right:var(--p);width:3px;background:#fff;z-index:2;box-shadow:0 0 10px #0006}
.line::after{content:"⇆";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:40px;height:40px;border-radius:50%;background:var(--t);color:#fff;display:grid;place-items:center}
.cmp span{position:absolute;bottom:12px;z-index:2;background:#ffffffdd;color:var(--td);padding:0 14px;border-radius:20px;font-size:.85rem}
.l1{right:12px}.l2{left:12px}

/* mobile */
@media(max-width:800px){
 .side{left:50%;top:auto;bottom:calc(10px + env(safe-area-inset-bottom));transform:translateX(-50%);flex-direction:row;padding:6px 10px;gap:2px;width:max-content;max-width:94vw}
 .side a{width:40px;height:40px}
 .side .logo{margin:0 4px 0 0}.side .cta{margin:0 0 0 4px}
 .side a[data-tip]::after{display:none}
 .sticky{align-items:flex-start;padding:24px 5vw 90px}
 .texts{height:250px;width:100%;margin-top:6vh}
 .card{padding:20px;border-radius:24px}
 .card.active:hover{transform:none}
 .veil{background:linear-gradient(180deg,#ffffff00 40%,#ffffffb0 100%),var(--tex)}
 .plain{padding:70px 5vw 110px}
 .masonry{grid-template-columns:repeat(2,1fr);grid-auto-rows:150px;gap:12px}
 .strip{grid-template-columns:repeat(2,1fr)}
 .box:hover,.shot:hover,.title:hover,.sub:hover,.more:hover{transform:none}
}
@media(hover:none){.box:hover,.shot:hover{transform:none}}

/* draggable infinite gallery */
.dgrid{position:relative;height:100vh;overflow:hidden;cursor:grab;touch-action:none;background:var(--tex),#f2fbfa;user-select:none;-webkit-user-select:none}
.dgrid.drag{cursor:grabbing}
.dworld{position:absolute;inset:0}
.dtile{position:absolute;left:0;top:0;will-change:transform}
.dtile .shot{width:100%;height:100%;aspect-ratio:auto;border-radius:22px;border-width:5px;pointer-events:auto}
.dgrid.drag .shot{transform:none}
.dhead{position:absolute;top:22px;right:50%;transform:translateX(50%);z-index:5;text-align:center;background:#ffffffe6;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid #0d948833;border-radius:28px;padding:6px 30px;box-shadow:0 10px 30px #0d948833;pointer-events:none;width:max-content;max-width:90vw}
.dhead h1{font-size:clamp(1.2rem,3vw,1.8rem);line-height:1.6;color:var(--td)}
.dhead p{font-size:.85rem;opacity:.75;line-height:1.7;padding-bottom:4px}
.dhint{position:absolute;bottom:20px;right:50%;transform:translateX(50%);z-index:5;background:var(--t);color:#fff;padding:2px 22px;border-radius:30px;font-size:.85rem;transition:opacity .5s;pointer-events:none}
.dhint.off{opacity:0}
.dgrid::after{content:"";position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 90px 10px #f2fbfa}
@media(max-width:800px){.dhead{top:16px;padding:4px 18px}.dhint{bottom:136px}}

/* hero links */

.hl{background:var(--t);color:#fff;padding:2px 22px;border-radius:30px;font-size:.92rem;transition:transform .3s}
.hl.ghost{background:#fff;color:var(--td);border:1.5px solid var(--t)}
.hl:hover{transform:scale(1.1)}
/* typing */
.typing::after{content:"";display:inline-block;width:2px;height:1em;background:var(--t);margin-inline-start:3px;vertical-align:-.12em;animation:blink .7s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
/* gallery page */
body.gpage{overflow:hidden;height:100vh}
.lb{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;background:#0f2f2cd9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);opacity:0;pointer-events:none;transition:opacity .35s}
.lb.open{opacity:1;pointer-events:auto}
.lbfig{position:relative;border-radius:30px;border:6px solid #fff;overflow:hidden;box-shadow:0 30px 80px #0008;background-size:cover;background-position:center;transform:scale(.7);transition:transform .45s cubic-bezier(.2,.9,.3,1.2)}
.lb.open .lbfig{transform:scale(1)}
.lbfig figcaption{position:absolute;bottom:14px;right:50%;transform:translateX(50%);background:#ffffffe6;color:var(--td);padding:2px 22px;border-radius:30px}
.lbx{position:absolute;top:18px;left:18px;width:46px;height:46px;border-radius:50%;border:none;background:#fff;color:var(--td);font-size:1.2rem;cursor:pointer;z-index:2;transition:transform .3s}
.lbx:hover{transform:scale(1.1)}
.dgrid{height:100vh}

/* fixed hero links */
.fixlinks{position:fixed;bottom:26px;left:0;right:0;z-index:35;display:flex;justify-content:center;align-items:center;gap:14px;pointer-events:none;transition:opacity .4s,transform .4s}
.fixlinks.hide{opacity:0;transform:translateY(30px)}
.fixlinks.hide .hl{pointer-events:none}
.fixlinks .hl{pointer-events:auto;display:inline-block;padding:6px 28px;font-size:1rem;box-shadow:0 10px 30px #0d948855;transform:translate(var(--mx,0),var(--my,0)) scale(var(--s,1));transition:transform .25s ease-out,background .3s}
.fixlinks .hl:hover{--s:1.1}
@media(max-width:800px){.fixlinks{bottom:84px;gap:8px}.fixlinks .hl{padding:4px 18px;font-size:.9rem}}
.lbfig{width:min(92vw,1000px);height:min(78vh,680px)}
@media(min-width:801px){.fixlinks #hlContact{position:absolute;right:6vw;bottom:0}}

/* ===== home: left sticky video + right column ===== */
body.home{background:var(--tex),#f4fbfa}
.layout{display:flex;flex-direction:row;align-items:flex-start;gap:0;min-height:100vh}
.vside{order:2;width:min(34vw,460px);flex:none;padding-left:84px}
.col{order:1;flex:1;min-width:0}
body.home .plain{padding:70px 4vw 70px 4vw;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
body.home .plain:nth-of-type(even){background:#e6f7f5aa}
body.home .plain.first{padding-top:90px}
.vstick{position:sticky;top:0;height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:18px 0}
.vframe{height:calc(100vh - 110px);aspect-ratio:9/16;max-width:100%;border-radius:32px;overflow:hidden;border:6px solid #fff;box-shadow:0 20px 60px #0d948855;background:#cfeeea}
.vframe video{width:100%;height:100%;object-fit:cover;display:block;background:#cfeeea url(poster.jpg) center/cover no-repeat}
.vlinks{display:flex;gap:10px;align-items:center;justify-content:center;flex-wrap:wrap}
.vlinks .hl{display:inline-block;padding:4px 22px;font-size:.95rem;box-shadow:0 8px 24px #0d948855;transform:translate(var(--mx,0),var(--my,0)) scale(var(--s,1));transition:transform .25s ease-out}
.vlinks .hl:hover{--s:1.1}
.hero{max-width:560px;margin:0 auto;text-align:right}
.hero h1{margin:4px 0}
.cards.one{grid-template-columns:1fr;max-width:560px;margin:26px auto 0;text-align:right}
body.home .gal,body.home .strip{grid-template-columns:1fr}
body.home .cards,body.home .cards.five{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto}
body.home .cards .box{text-align:right}
body.home .strip{grid-template-columns:repeat(2,1fr)}
body.home .gal{max-width:560px;margin:0 auto}
@media(max-width:800px){
 .layout{flex-direction:column}
 .vside{order:0;width:100%;padding:0;position:sticky;top:0;z-index:30;background:linear-gradient(#f4fbfaf5 85%,#f4fbfa00)}
 .vstick{position:static;height:auto;flex-direction:row;justify-content:center;gap:12px;padding:10px 4vw 12px}
 .vframe{height:38vh;border-width:4px;border-radius:22px}
 .vlinks{flex-direction:column;align-items:stretch;gap:8px}
 .vlinks .hl{text-align:center;font-size:.85rem;padding:4px 14px}
 body.home .plain{padding:50px 5vw 50px}
 body.home .plain.first{padding-top:30px}
 .col{order:1}
}
.layout{align-items:stretch}
@media(max-width:800px){.vside{background:#f4fbfa;box-shadow:0 10px 24px #0d94882a;border-radius:0 0 24px 24px}}

/* ===== v3: full-bleed video on the left ===== */
body.home{background:var(--tex),#f6fbfa}
.layout{display:block;min-height:100vh}
.vside{position:fixed;left:0;top:0;bottom:0;width:44vw;max-width:none;padding:0;order:0;z-index:1}
.vstick{position:static;height:100%;padding:0;display:block}
.vframe{position:relative;width:100%;height:100%;max-height:none;aspect-ratio:auto;border:0;border-radius:0;box-shadow:none;background:transparent;overflow:hidden}
.vframe video{width:100%;height:100%;object-fit:cover;object-position:left center;filter:brightness(1.07) contrast(1.02);
 -webkit-mask-image:linear-gradient(to right,#000 0%,#000 62%,transparent 100%);mask-image:linear-gradient(to right,#000 0%,#000 62%,transparent 100%)}
.vlinks{position:absolute;left:0;right:0;bottom:22px;z-index:3;display:flex;flex-direction:row;gap:12px;justify-content:center;padding:0 24px 0 90px}
.vlinks .hl{box-shadow:0 10px 28px #0d948866}
.col{margin-left:44vw;position:relative;z-index:2}
body.home .plain:nth-of-type(even){background:#e6f7f5cc}
.shotlink{display:block;border-radius:24px}
.shotlink .shot{cursor:pointer}
@media(max-width:800px){
 .vside{position:sticky;top:0;left:auto;bottom:auto;width:100%;height:42vh;z-index:30;background:#f6fbfa;box-shadow:0 8px 22px #0d94882a;border-radius:0 0 24px 24px;overflow:hidden}
 .vframe video{object-position:center center;-webkit-mask-image:none;mask-image:none;filter:brightness(1.05)}
 .vlinks{bottom:10px;padding:0 12px;gap:8px}
 .vlinks .hl{padding:2px 14px;font-size:.82rem}
 .col{margin-left:0}
 .layout{display:flex;flex-direction:column}
}

/* blog */
body.blogpage{background:var(--tex),#f6fbfa}
.blogmain,.post{max-width:1000px;margin:0 auto;padding:90px 5vw 70px calc(5vw + 70px);text-align:center}
.bgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:24px;margin-top:20px;text-align:right}
.bcard{display:block;padding:14px 14px 20px}
.bimg{aspect-ratio:16/10;border-radius:18px;margin-bottom:12px;filter:grayscale(1) contrast(1.3);transition:filter .5s;border-width:3px}
.bcard:hover .bimg{filter:none}
.bcard h3{font-size:1.05rem;line-height:1.8;margin:6px 0}
.bcard p{font-size:.9rem;opacity:.8}
.rm{display:inline-block;margin-top:8px;color:var(--t);font-weight:700}
.post{max-width:780px;text-align:right}
.post .back{display:inline-block;color:var(--td);margin-bottom:14px}
.pcover{aspect-ratio:16/8;border-radius:28px;margin-bottom:18px}
.post h1{font-size:clamp(1.5rem,3.5vw,2.3rem);color:var(--td);margin:8px 0 18px;line-height:1.7}
.pbody{background:#fff;border:1px solid #0d948833;border-radius:26px;padding:10px 28px 22px;box-shadow:0 10px 30px #0d94881f}
.pbody h2{font-size:1.2rem;margin-top:16px}
@media(max-width:800px){.blogmain,.post{padding:50px 5vw 110px}}

/* ===== v4: fonts, logo, splash, mobile intro, new sections ===== */
body{font-family:Vazir,Tahoma,sans-serif;line-height:2}
h1,h2,.title,.dhead h1{font-family:Vazir,Vazir,serif;font-weight:800;line-height:1.9}
h1{font-size:clamp(2.3rem,5vw,3.8rem)}
h2,.title{font-size:clamp(1.8rem,3.6vw,2.7rem)}
.title.big{font-size:clamp(2.3rem,5.5vw,4rem)}
.dhead h1{font-size:clamp(1.5rem,3.4vw,2.2rem)}
h3{font-weight:700}
input,select,textarea,button{font:inherit}

.side .logo{width:54px;height:54px;background:#fff;border:1.5px solid #0d94882e;padding:3px;margin-bottom:6px;color:inherit}
.side .logo img{width:100%;height:100%;object-fit:contain;display:block;transition:transform .6s}
.side .logo:hover{background:#fff}
.side .logo:hover img{transform:rotate(360deg)}
.side .logo+a{margin-top:0}

/* splash */
.splash{display:none}
html.sp .splash{position:fixed;inset:0;z-index:999;background:#fff;display:grid;place-items:center;transition:opacity .8s ease,visibility .8s}
html.sp .splash.out{opacity:0;visibility:hidden}
.sp-in{text-align:center}
.sp-in img{width:min(52vw,230px);height:auto;display:block;margin:0 auto;clip-path:circle(0% at 50% 50%);animation:ink 1.5s cubic-bezier(.3,.7,.2,1) .15s forwards}
.sp-in p{margin-top:14px;font-family:Vazir,sans-serif;font-size:1.3rem;color:var(--td);opacity:0;animation:fin .8s ease 1.2s forwards;letter-spacing:.02em}
@keyframes ink{0%{clip-path:circle(0% at 50% 50%);transform:scale(.85) rotate(-12deg)}100%{clip-path:circle(75% at 50% 50%);transform:none}}
@keyframes fin{to{opacity:1}}

/* watermark in hero */
#hero{position:relative;overflow:hidden}
.wm{position:absolute;width:min(520px,90%);left:50%;top:50%;margin:-260px 0 0 -260px;opacity:.07;pointer-events:none;animation:spin 120s linear infinite;z-index:0}
@media(max-width:800px){.wm{width:340px;margin:-170px 0 0 -170px}}
#hero>*:not(.wm){position:relative;z-index:1}
@keyframes spin{to{transform:rotate(360deg)}}

/* trust */
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:14px;max-width:560px;margin:18px auto}
.st{text-align:center;padding:16px 8px}
.st b{display:block;width:auto;height:auto;border-radius:0;background:none;margin:0;font-family:Vazir,sans-serif;font-size:2.4rem;color:var(--t);line-height:1.6}
.st span{font-size:.9rem;opacity:.8}
.trustc{margin-top:8px}

/* order form */
.formbox{max-width:560px;margin:18px auto;display:grid;grid-template-columns:1fr 1fr;gap:12px;text-align:right;padding:22px}
.formbox label{display:flex;flex-direction:column;font-size:.85rem;font-weight:500;color:var(--td)}
.formbox .full{grid-column:1/-1}
.formbox input,.formbox select,.formbox textarea{margin-top:4px;border:1.5px solid #0d94883a;border-radius:14px;padding:6px 12px;background:#fff;color:var(--ink);outline:none;transition:border .2s,box-shadow .2s;font-size:.95rem;width:100%}
.formbox input:focus,.formbox select:focus,.formbox textarea:focus{border-color:var(--t);box-shadow:0 0 0 4px #0d94881f}
.fbtns{display:flex;gap:10px;flex-wrap:wrap}
.fbtns .hl{border:0;cursor:pointer;padding:4px 22px;display:inline-block}
.fbtns .hl.ghost{border:1.5px solid var(--t)}
.fnote{font-size:.78rem;opacity:.65;line-height:1.8}
@media(max-width:560px){.formbox{grid-template-columns:1fr}}
.stampwrap{height:150px;position:relative;margin-top:10px}
.stamp{position:absolute;left:50%;top:50%;width:120px;margin:-60px 0 0 -60px;opacity:0;transform:scale(2.2) rotate(-25deg);mix-blend-mode:multiply}
.stamp.on{animation:stamp .9s cubic-bezier(.2,.9,.3,1.3) forwards}
@keyframes stamp{0%{opacity:0;transform:scale(2.2) rotate(-25deg)}55%{opacity:1;transform:scale(.92) rotate(-6deg)}100%{opacity:.9;transform:scale(1) rotate(-8deg)}}
.flogo{width:54px;opacity:.85;margin-bottom:4px}

/* whatsapp */
.wa{position:fixed;right:18px;bottom:20px;z-index:45;width:54px;height:54px;border-radius:50%;background:#25d366;color:#fff;display:grid;place-items:center;box-shadow:0 10px 26px #25d36677;transition:transform .25s}
.wa:hover{transform:scale(1.1)}
.wa svg{width:28px;height:28px}
@media(max-width:800px){.wa{bottom:76px;right:12px;width:46px;height:46px;padding-bottom:env(safe-area-inset-bottom)}.wa svg{width:24px;height:24px}}

/* gallery header fade on first touch (mobile) */
.dhead,.dhint{transition:opacity 1.6s ease}
.dhead.fade,.dhint.fade{opacity:0;pointer-events:none}

/* scroll hint over the video */
.shint{position:absolute;left:0;right:0;text-align:center;bottom:150px;z-index:3;color:#0f766e;font-size:.85rem;font-weight:700;display:none}
.shint i{display:block;width:14px;height:14px;margin:6px auto 0;border-right:2.5px solid var(--t);border-bottom:2.5px solid var(--t);transform:rotate(45deg);animation:bob 1.3s ease-in-out infinite}
@keyframes bob{50%{transform:translateY(7px) rotate(45deg)}}

/* ===== mobile: full-screen intro video that shrinks while content rises ===== */
@media(max-width:800px){
 .vside{background:transparent;box-shadow:none;border-radius:0;overflow:visible;height:42vh}
 .vframe{position:absolute;top:0;left:0;right:0;height:100vh;background:#f6fbfa;border-radius:0 0 26px 26px;box-shadow:0 10px 28px #0d94883a}
 .col{padding-top:58vh}
 .vlinks{bottom:140px}
 .shint{display:block}
 .stats{grid-template-columns:repeat(2,1fr)}
}

/* ===== v5 ===== */
h1,h2,.title,.dhead h1,.st b{font-family:Vazir,sans-serif;font-weight:800;letter-spacing:0}
h1{font-size:clamp(2rem,4.6vw,3.4rem);line-height:1.7}
h2,.title{font-size:clamp(1.6rem,3.2vw,2.3rem);line-height:1.8}
.title.big{font-size:clamp(2rem,5vw,3.4rem)}
.sp-in p{font-family:Vazir,sans-serif;font-weight:700}
.shot figcaption,.lbfig figcaption{display:none}
.wm{display:none}
/* roaming logo behind the text */
.roam{position:fixed;left:0;top:0;width:300px;height:300px;margin:-150px 0 0 -150px;opacity:.09;pointer-events:none;z-index:1;will-change:transform}
.roam img{width:100%;height:100%;display:block;animation:spin 60s linear infinite}
@media(max-width:800px){.roam{width:220px;height:220px;margin:-110px 0 0 -110px;opacity:.1}}
body.home .plain,body.home .plain:nth-of-type(even){background:transparent}
body.home .vside{z-index:0}
.col{z-index:2}
/* old-camera viewfinder frame on hover */
.shot::after{content:"";position:absolute;inset:12px;pointer-events:none;opacity:0;transform:scale(1.07);transition:opacity .25s,transform .35s cubic-bezier(.2,.9,.3,1.2);z-index:4;
 background:
  linear-gradient(#fff,#fff) 0 0/26px 3px,linear-gradient(#fff,#fff) 0 0/3px 26px,
  linear-gradient(#fff,#fff) 100% 0/26px 3px,linear-gradient(#fff,#fff) 100% 0/3px 26px,
  linear-gradient(#fff,#fff) 0 100%/26px 3px,linear-gradient(#fff,#fff) 0 100%/3px 26px,
  linear-gradient(#fff,#fff) 100% 100%/26px 3px,linear-gradient(#fff,#fff) 100% 100%/3px 26px,
  linear-gradient(#fff,#fff) 50% 50%/22px 2px,linear-gradient(#fff,#fff) 50% 50%/2px 22px;
 background-repeat:no-repeat;filter:drop-shadow(0 0 3px #0008)}
.shot:hover::after,.shot.in::after{opacity:.95;transform:scale(1)}
.shot:hover,.shot.in{outline:1px solid #ffffffaa;outline-offset:-5px}
.bimg::after{inset:8px}

/* v6: on mobile the page text slides UNDER the shrunken video */
@media(max-width:800px){ body.home .vside{z-index:30} .vframe{background:#f6fbfa} }

/* ===== order page ===== */
body.orderpage{background:var(--tex),#f6fbfa}
.ordermain{max-width:900px;margin:0 auto;padding:80px 20px 60px 110px;text-align:center}
.swrap{overflow-x:auto;padding:6px}
.stage{position:relative;width:100%;max-width:820px;margin:14px auto;aspect-ratio:629.52/876.24;container-type:inline-size;background:#fff url(plan.jpg) center/100% 100% no-repeat;border-radius:18px;box-shadow:0 18px 50px #0d948844;direction:rtl}
.stage .tf,.stage .tn{position:absolute;background:transparent;border:0;border-radius:8px;color:#1b2a6b;font-family:Vazir,sans-serif;font-weight:500;font-size:2.45cqw;outline:none;transition:background .2s,box-shadow .2s;padding:0 2px}
.stage .tf{transform:translate(-50%,-50%);height:3.3%;line-height:1}
.stage .tn{resize:none;line-height:3.44cqw;font-weight:400;padding:.6cqw 0 0;overflow:auto;background-image:none}
.stage .tf:hover,.stage .tn:hover{background:#ffffff55}
.stage .tf:focus,.stage .tn:focus{background:#ffffffaa;box-shadow:0 0 0 .35cqw #0d948888}
.stage .dot,.stage .tooth{position:absolute;transform:translate(-50%,-50%);width:3.6%;aspect-ratio:1;display:grid;place-items:center;cursor:pointer}
.stage .tooth{width:2.9%}
.stage input[type=checkbox],.stage input[type=radio]{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.stage .dot i{width:66%;height:66%;border-radius:50%;display:block;transition:background .2s,box-shadow .2s,transform .2s}
.stage .dot:hover i{box-shadow:0 0 0 .5cqw #1b2a6b55}
.stage .dot input:checked+i{background:#1b2a6b;box-shadow:0 0 0 .4cqw #ffffffaa}
.stage .dot input:checked+i::after{content:"";display:block;width:34%;height:58%;margin:7% auto 0;border:solid #fff;border-width:0 .55cqw .55cqw 0;transform:translateY(8%) rotate(40deg)}
.stage .dot input:focus-visible+i,.stage .tooth input:focus-visible+i{box-shadow:0 0 0 .6cqw #0d9488}
.stage .tooth i{width:100%;height:100%;border-radius:50%;display:block;transition:background .2s,box-shadow .2s}
.stage .tooth:hover i{background:#1b2a6b1f}
.stage .tooth input:checked+i{background:#1b2a6b24;box-shadow:inset 0 0 0 .4cqw #1b2a6b}
.shintm{display:none;font-size:.8rem;opacity:.7}
.obox{background:#ffffffee;border:1px solid #0d948833;border-radius:26px;padding:18px 22px 22px;margin:18px auto;max-width:820px;box-shadow:0 10px 30px #0d94881f;text-align:right}
.obox h2{font-size:1.3rem;margin-bottom:2px}
.sub2{font-size:.9rem;opacity:.75}
.upl{display:inline-block;margin-top:10px;cursor:pointer}
.upl input{position:absolute;opacity:0;width:1px;height:1px}
.upl span{display:inline-block;background:var(--tl);color:var(--td);border:1.5px dashed var(--t);border-radius:20px;padding:6px 26px;font-weight:700;transition:transform .2s,background .2s}
.upl:hover span{transform:scale(1.04);background:#d4f1ed}
.upl input:focus-visible+span{outline:3px solid var(--t)}
.flist{list-style:none;margin:10px 0 0;padding:0;font-size:.85rem;direction:ltr;text-align:left}
.cph{display:flex;flex-direction:column;font-size:.85rem;font-weight:500;color:var(--td);margin-top:12px;max-width:300px}
.cph input{margin-top:4px;border:1.5px solid #0d94883a;border-radius:14px;padding:6px 12px;background:#fff;outline:none;font:inherit}
.cph input:focus{border-color:var(--t);box-shadow:0 0 0 4px #0d94881f}
.obtns{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}
.obtns .hl{border:0;cursor:pointer;display:inline-block;padding:4px 20px;font-size:.92rem}
.obtns .hl.ghost{border:1.5px solid var(--t)}
.obtns .hl.dim{opacity:.55}
.omsg{display:none;margin-top:14px;padding:8px 16px;border-radius:16px;background:#fff3e0;color:#7a4b00;font-size:.88rem;line-height:1.9}
.omsg.show{display:block}.omsg.ok{background:var(--tl);color:var(--td)}
#printarea{display:none}
@media(max-width:800px){
 .ordermain{padding:44px 10px 110px}
 .stage{min-width:640px}
 .shintm{display:block}
}
@media print{
 @page{size:629.52pt 876.24pt;margin:0}
 body.orderpage>*{display:none!important}
 body.orderpage>#printarea{display:block!important}
 #printarea img{width:100%;height:auto;display:block}
}

/* ===== fix-pack (بدون حذف هیچ بخش): اعتبارسنجی، خطای حجم، تداخل موبایل ===== */
.fhint{display:block;font-size:.75rem;opacity:.65;font-weight:400;margin-top:2px;line-height:1.8}
.flist li.over{color:#b3261e;font-weight:700}
.formbox input.bad,.cph input.bad{border-color:#b3261e;box-shadow:0 0 0 4px #b3261e22}
.omsg.err{background:#fdecea;color:#7a1f1a}

/* ===== v7: dark/light, loader, lang, uploads ===== */
html[data-theme="dark"]{
 --t:#2dd4bf;--td:#5eead4;--tl:#0f3d38;--ink:#e6fffb;
 --tex:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='180' height='180'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .05  0 0 0 0 .5  0 0 0 0 .45  0 0 0 .09 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}
html[data-theme="dark"] body{background:#0b1f1d var(--tex);color:var(--ink)}
html[data-theme="dark"] .plain{background:#0e2622e6}
html[data-theme="dark"] .plain:nth-of-type(even){background:#0c2b26e6}
html[data-theme="dark"] body.home .plain,body.home .plain{background:transparent}
html[data-theme="dark"] body.home .plain:nth-of-type(even){background:#0c2b26b8}
html[data-theme="dark"] .box{background:#0e2a26;border-color:#2dd4bf40;box-shadow:0 10px 30px #00000059}
html[data-theme="dark"] h2{color:var(--td)}
html[data-theme="dark"] .formbox input,html[data-theme="dark"] .formbox select,html[data-theme="dark"] .formbox textarea,
html[data-theme="dark"] .cph input{background:#0b221f;color:var(--ink);border-color:#2dd4bf4d}
html[data-theme="dark"] .side{background:#0e2a26d9;border-color:#2dd4bf33}
html[data-theme="dark"] .veil{background:#0b1f1dd9}
html[data-theme="dark"] body.blogpage,html[data-theme="dark"] body.orderpage,html[data-theme="dark"] body.gpage{background:#0b1f1d var(--tex)}
html[data-theme="dark"] .blogmain,html[data-theme="dark"] .post{color:#e6fffb}
html[data-theme="dark"] .pbody{background:#0e2a26;border-color:#2dd4bf40}
html[data-theme="dark"] .obox{background:#0e2a26ee;border-color:#2dd4bf40}
html[data-theme="dark"] .stage{box-shadow:0 18px 50px #00000073}
html[data-theme="dark"] .dgrid{background:#0e2622 var(--tex)}
html[data-theme="dark"] .dgrid::after{box-shadow:inset 0 0 90px 10px #0e2622}
html[data-theme="dark"] .dhead{background:#0e2a26e6;border-color:#2dd4bf33}
html[data-theme="dark"] .dhead p{opacity:.8}
html[data-theme="dark"] .cmp span{background:#0e2a26e6;color:var(--td)}
html[data-theme="dark"] .shot{border-color:#0e2a26}
html[data-theme="dark"] .shot::after{filter:drop-shadow(0 0 3px #0008)}
html[data-theme="dark"] .bimg{border-color:#0e2a26}
html[data-theme="dark"] .vlinks .hl,html[data-theme="dark"] .more{box-shadow:0 8px 24px #00000073}
html[data-theme="dark"] .fbtns .hl.ghost{background:transparent;color:var(--td)}
html[data-theme="dark"] .stamp{mix-blend-mode:screen;filter:invert(1) hue-rotate(150deg)}
html[data-theme="dark"] .flogo{filter:invert(1) hue-rotate(150deg);opacity:.7}
html[data-theme="dark"] footer{opacity:.55}
html[data-theme="dark"] .vside{background:#0b1f1d}
@media(max-width:800px){html[data-theme="dark"] .vside{background:#0b1f1d;box-shadow:0 10px 24px #0006}html[data-theme="dark"] .vframe{background:#0b1f1d}}


/* new loader splash: logo (teal) + loader + Loading Smiles... */
.splash{display:none}
html.sp .splash{position:fixed;inset:0;z-index:999;background:#fff;display:grid;place-items:center;transition:opacity .8s ease,visibility .8s}
html.sp .splash.out{opacity:0;visibility:hidden}
.sp-in{text-align:center}
html[data-theme="dark"] html.sp .splash,html.sp html[data-theme="dark"] .splash{background:#0b1f1d}
html[data-theme="dark"] .splash{background:#0b1f1d!important}
.sp-in p{margin-top:0;font-family:Vazir,sans-serif;font-weight:700;font-size:1.25rem;color:var(--td);letter-spacing:.03em;direction:ltr;opacity:0;animation:fin .8s ease .9s forwards}
html[data-theme="dark"] html[data-theme="dark"] 
/* contact section without form */
.cta-wrap{margin-top:10px}
html[dir="ltr"] .hero,html[dir="ltr"] .cards.one,html[dir="ltr"] body.home .cards .box{text-align:left}
html[dir="ltr"] .post{text-align:left}

/* user uploads (blog submissions) */
.up-wait{grid-column:1/-1;border:1.5px dashed #0d948859;border-radius:22px;padding:18px;background:#ffffffaa}
html[data-theme="dark"] .up-wait{background:#0e2a26aa}
.up-wait h3{color:var(--td)}
.up-wait .bimg{filter:grayscale(1) contrast(1.3)}
.up-wait .bimg:hover{filter:none}

/* ===== fixes: splash logo, dark video, i18n ===== */
html[data-theme="dark"] .vframe video,html[data-theme="dark"] #vid{filter:brightness(.72) contrast(1.05) saturate(.95);background-color:#0b1f1d}
html[data-theme="dark"] .vframe{background:#0b1f1d}
html[data-theme="dark"] .splash{background:#0b1f1d!important}
.sp-in p{font-family:Vazir,Tahoma,sans-serif}
html[data-theme="dark"] .shint{color:#e6fffb;text-shadow:0 1px 6px #000a}

/* ===== splash: smiley loader ===== */
.sp-in .smile{display:block;width:min(40vw,150px);height:auto;margin:0 auto 6px;overflow:visible;
 --a:hsl(173,80%,40%);--b:hsl(190,85%,34%)}
html[data-theme="dark"] .sp-in .smile{--a:hsl(168,75%,55%);--b:hsl(188,85%,50%)}
.smile .sm-a{fill:var(--a)}.smile .sm-as{stroke:var(--a)}
.smile .sm-b{fill:var(--b)}.smile .sm-bs{stroke:var(--b)}
.loader__eye1,.loader__eye2,.loader__mouth1,.loader__mouth2{animation:eye1 3s ease-in-out infinite}
.loader__eye1,.loader__eye2{transform-origin:64px 64px}
.loader__eye2{animation-name:eye2}
.loader__mouth1{animation-name:mouth1}
.loader__mouth2{animation-name:mouth2;visibility:hidden}
@keyframes eye1{from{transform:rotate(-260deg) translate(0,-56px)}50%,60%{animation-timing-function:cubic-bezier(.17,0,.58,1);transform:rotate(-40deg) translate(0,-56px) scale(1)}to{transform:rotate(225deg) translate(0,-56px) scale(.35)}}
@keyframes eye2{from{transform:rotate(-260deg) translate(0,-56px)}50%{transform:rotate(40deg) translate(0,-56px) rotate(-40deg) scale(1)}52.5%{transform:rotate(40deg) translate(0,-56px) rotate(-40deg) scale(1,0)}55%,70%{animation-timing-function:cubic-bezier(0,0,.28,1);transform:rotate(40deg) translate(0,-56px) rotate(-40deg) scale(1)}to{transform:rotate(150deg) translate(0,-56px) scale(.4)}}
@keyframes mouth1{from{animation-timing-function:ease-in;stroke-dasharray:0 351.86;stroke-dashoffset:0}25%{animation-timing-function:ease-out;stroke-dasharray:175.93 351.86;stroke-dashoffset:0}50%{animation-timing-function:steps(1,start);stroke-dasharray:175.93 351.86;stroke-dashoffset:-175.93;visibility:visible}75%,to{visibility:hidden}}
@keyframes mouth2{from{animation-timing-function:steps(1,end);visibility:hidden}50%{animation-timing-function:ease-in-out;visibility:visible;stroke-dashoffset:0}to{stroke-dashoffset:-351.86}}
.sp-in p{opacity:1;animation:none;margin-top:4px}

/* ===== day / night + language switches (pill with knob) ===== */
.topctl{position:fixed;top:12px;left:64px;z-index:46;display:flex;flex-direction:row-reverse;direction:ltr;gap:10px;transition:opacity .35s ease,transform .35s ease}
.topctl.away{opacity:0;transform:translateY(-18px);pointer-events:none}
.tgl{direction:ltr;position:relative;flex:none;width:118px;height:40px;padding:0;border:0;border-radius:40px;cursor:pointer;color:#fff;font-family:Vazir,Tahoma,sans-serif;font-weight:700;font-size:.72rem;letter-spacing:.02em;background:#f59e0b;box-shadow:inset 0 2px 5px #0003,0 6px 16px #0003;transition:background .4s ease,transform .2s;-webkit-tap-highlight-color:transparent}
.tgl:hover{transform:scale(1.04)}
.tgl:focus-visible{outline:3px solid var(--td);outline-offset:3px}
.tgl .tl{position:absolute;inset:0;display:grid;place-items:center;padding:0 44px 0 12px;white-space:nowrap;line-height:1;transition:padding .4s ease}
.tgl .tk{position:absolute;top:4px;right:4px;width:32px;height:32px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 2px 6px #0004;transition:right .4s cubic-bezier(.6,-.2,.3,1.2),transform .4s}
.tgl .tl>*{grid-area:1/1}
.tgl svg{width:21px;height:21px;grid-area:1/1;fill:none;stroke-linecap:round;stroke-linejoin:round}
/* theme: day (default) */
#themeBtn .ln,#themeBtn .i-moon{display:none}
#themeBtn .i-sun{stroke:#f59e0b;stroke-width:2}
#themeBtn .i-sun circle{fill:#f59e0b}
html[data-theme="dark"] #themeBtn{background:#16233f}
html[data-theme="dark"] #themeBtn .ld,html[data-theme="dark"] #themeBtn .i-sun{display:none}
html[data-theme="dark"] #themeBtn .ln,html[data-theme="dark"] #themeBtn .i-moon{display:block}
html[data-theme="dark"] #themeBtn .tk{right:calc(100% - 36px)}
html[data-theme="dark"] #themeBtn .tl{padding:0 12px 0 44px}
#themeBtn .i-moon{fill:#b9bdc9;stroke:#b9bdc9;stroke-width:1}
/* language: fa (default) */
.lg{background:#0d9488}
.lg .le,.lg .ke{display:none}
.lg .tk b{font-size:.78rem;color:#0d9488;line-height:1;grid-area:1/1}
html[data-lang="en"] .lg{background:#3b46b5}
html[data-lang="en"] .lg .lf,html[data-lang="en"] .lg .kf{display:none}
html[data-lang="en"] .lg .le,html[data-lang="en"] .lg .ke{display:block}
html[data-lang="en"] .lg .tk{right:calc(100% - 36px)}
html[data-lang="en"] .lg .tl{padding:0 12px 0 44px}
html[data-lang="en"] .lg .tk b{color:#3b46b5}
@media(max-width:800px){.topctl{left:auto;right:10px;top:10px;gap:8px}.tgl{width:104px;height:36px;font-size:.66rem}.tgl .tk{width:28px;height:28px;top:4px}.tgl svg{width:18px;height:18px}html[data-theme="dark"] #themeBtn .tk,html[data-lang="en"] .lg .tk{right:calc(100% - 32px)}.tgl .tl{padding:0 38px 0 8px}html[data-theme="dark"] #themeBtn .tl,html[data-lang="en"] .lg .tl{padding:0 8px 0 38px}}

/* ===== site footer ===== */
footer.sitefoot{opacity:1;margin:60px 0 0;font-size:.88rem;line-height:1.9;text-align:right;color:#cdeeea;background:linear-gradient(135deg,#0f766e 0%,#0b4f4a 55%,#083936 100%);padding:54px 5vw 22px;position:relative;z-index:3;overflow:hidden}
body.blogpage footer.sitefoot,body.orderpage footer.sitefoot{padding-left:calc(5vw + 70px)}
body.home footer.sitefoot{margin:0;padding:50px 4vw 22px}
html[data-theme="dark"] footer.sitefoot{background:linear-gradient(135deg,#0c3a36 0%,#082a28 55%,#061c1b 100%)}
.sf-grid{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:30px 26px}
body.home .sf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.sf-col h4{display:flex;align-items:center;gap:10px;font-size:1.05rem;font-weight:700;color:#fff;margin-bottom:16px;line-height:1.5}
.sf-col h4 .fi{flex:none;width:34px;height:34px;border-radius:50%;border:1.5px solid #5eead4;display:grid;place-items:center}
.sf-col h4 .fi svg{width:16px;height:16px;fill:none;stroke:#5eead4;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.sf-line{display:flex;align-items:flex-start;gap:10px;margin-bottom:8px;color:#bfe6e1}
.sf-line svg{flex:none;width:15px;height:15px;margin-top:7px;fill:none;stroke:#5eead4;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.sf-line a{color:#5eead4}.sf-line a:hover{color:#fff}
.ltr{direction:ltr;unicode-bidi:embed}
.sf-mail{display:flex;margin-top:14px;border:1.5px solid #5eead4;border-radius:14px;overflow:hidden;background:#ffffff14}
.sf-mail input{flex:1;min-width:0;background:transparent;border:0;outline:none;color:#fff;padding:6px 12px;font:inherit;font-size:.85rem;text-align:right}
.sf-mail input::placeholder{color:#9fd3cd}
.sf-mail button{flex:none;width:44px;border:0;background:#5eead4;cursor:pointer;display:grid;place-items:center;transition:background .2s}
.sf-mail button:hover{background:#fff}
.sf-mail button svg{width:17px;height:17px;fill:none;stroke:#0b4f4a;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
html[dir="rtl"] .sf-mail button svg{transform:scaleX(-1)}
.sf-msg{display:none;margin-top:8px;font-size:.8rem;color:#fecaca}.sf-msg.show{display:block}.sf-msg.ok{color:#99f6e4}
.fpost{display:flex;gap:12px;align-items:flex-start;margin-bottom:14px;color:#cdeeea}
.fpost img{flex:none;width:62px;height:52px;object-fit:cover;border-radius:8px;border:1px solid #5eead433}
.fpost b{display:block;font-weight:500;font-size:.84rem;line-height:1.7;color:#e6fffb}
.fpost small{display:block;font-size:.72rem;color:#8fcfc7;margin-top:2px}
.fpost:hover b{color:#5eead4}
.sf-links{list-style:none}
.sf-links li{margin-bottom:6px}
.sf-links a{color:#bfe6e1;transition:color .2s,padding .2s}
.sf-links a:hover{color:#5eead4;padding-right:6px}
html[dir="ltr"] .sf-links a:hover{padding-right:0;padding-left:6px}
.sf-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.sf-gal img{width:100%;aspect-ratio:1;object-fit:cover;border-radius:8px;display:block;transition:transform .25s,opacity .25s}
.sf-gal a:hover img{transform:scale(1.08)}
.sf-bottom{max-width:1100px;margin:34px auto 0;padding-top:18px;border-top:1px solid #5eead433;display:flex;justify-content:space-between;gap:10px 20px;flex-wrap:wrap;font-size:.78rem;color:#8fcfc7}
html[dir="ltr"] footer.sitefoot{text-align:left}
html[dir="ltr"] .sf-mail input{text-align:left}
html[dir="ltr"] .sf-mail{flex-direction:row}
html[dir="ltr"] .sf-mail button svg{transform:none}
@media(max-width:1000px){.sf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:800px){footer.sitefoot,body.blogpage footer.sitefoot,body.orderpage footer.sitefoot,body.home footer.sitefoot{padding:40px 6vw 110px}}
@media(max-width:520px){.sf-grid{grid-template-columns:1fr}}

/* submit form: upload box */
.upbox{border:1.5px dashed #0d948859;border-radius:18px;padding:14px 16px;text-align:center;background:#0d94880d}
.upbox .uph{display:block;font-weight:700;color:var(--td);font-size:.9rem}
.upbox .upl{display:inline-block;margin-top:6px}
.upbox .upn{display:block;opacity:.7;font-size:.76rem;margin-top:2px}
.upbox .flist{direction:rtl;text-align:right}
html[dir="ltr"] .upbox .flist{direction:ltr;text-align:left}
.flist .frm{margin-inline-start:10px;border:0;background:#b3261e1a;color:#b3261e;width:22px;height:22px;border-radius:50%;cursor:pointer;line-height:1}
.formbox textarea{resize:vertical;min-height:150px;font-family:inherit;line-height:1.9}
.formbox label>span:first-child{display:block}
html[data-theme="dark"] .upbox{background:#2dd4bf0d;border-color:#2dd4bf59}

/* =====================================================================
   V4 EXPERIMENT — refined look: warm cream + turquoise brand + champagne
   (this block overrides everything above; delete it to go back)
   ===================================================================== */
:root{
 --t:#12a7ae;            /* brand turquoise: buttons, small accents */
 --td:#0a5f68;           /* deep turquoise: headings, text accents */
 --tl:#e6f4f3;
 --ink:#1c2d30;
 --gold:#b8985a;         /* champagne */
 --gold-l:#e3d3ad;
 --cream:#faf7f1;
 --cream2:#f2ede3;
 --line:#e7dfcf;
}
body{background:var(--cream)}
body.home,body.blogpage,body.orderpage,body.gpage{background:var(--cream)}
.veil,.sketch{display:none}
.bgvid{display:none}

/* sections: calm cream / white rhythm, no noise, no blur */
.plain,body.home .plain{background:var(--cream);-webkit-backdrop-filter:none;backdrop-filter:none}
.plain:nth-of-type(even),body.home .plain:nth-of-type(even){background:#fff}
body.home .plain{padding:96px 4vw}
.plain{padding-top:96px;padding-bottom:96px}
body.home .plain.first{padding-top:96px}

/* titles: bigger, deep turquoise, little gold rule */
.title{display:block;font-size:clamp(1.8rem,3.6vw,2.6rem);color:var(--td);font-weight:800;margin-bottom:12px;line-height:1.5}
.title::after{content:"";display:block;width:54px;height:3px;border-radius:3px;margin:12px auto 0;background:linear-gradient(90deg,var(--gold),var(--gold-l))}
.sub{opacity:1;color:#5d6e70;font-size:.98rem;margin-bottom:44px}
.title:hover,.sub:hover{transform:none}
h1{color:#0c3a40}
h1 em{color:var(--t)}
h2{color:var(--td)}

/* cards: quiet, flat, thin warm border */
.box{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:0 1px 2px #1c2d3008,0 12px 32px -14px #1c2d3026}
.plain:nth-of-type(even) .box{background:var(--cream)}
.box:hover{transform:translateY(-5px);box-shadow:0 2px 4px #1c2d3008,0 22px 40px -16px #0a5f6844;border-color:var(--gold-l)}
.box h3{color:var(--td)}
.box b{background:#fff;color:var(--gold);border:1.5px solid var(--gold-l);font-weight:700}
.st b{border:0;background:none;color:var(--td)}
.st{padding:22px 10px}
.card{background:#fffffff2;border:1px solid var(--line);border-radius:22px;box-shadow:0 22px 50px -20px #0a2a2e55}
.card.active:hover{transform:none}
.tag{background:#fff;border:1px solid var(--gold-l);color:#8a6d33;font-weight:500}
.hero .tag,.box .tag{background:var(--cream)}

/* buttons: turquoise stays only here */
.more,.vlinks .hl,.fbtns .hl,button.hl,a.hl{background:var(--t);color:#fff;border-radius:12px;box-shadow:0 8px 20px -8px #12a7aeaa;transition:transform .25s,box-shadow .25s,background .25s}
.more:hover{transform:translateY(-2px);background:var(--td)}
.fbtns .hl.ghost{background:transparent;color:var(--td);border:1.5px solid var(--td);box-shadow:none}
.bar i{background:linear-gradient(90deg,var(--t),var(--gold))}

/* phone frame + side nav: quieter */
.vframe{border:0;border-radius:28px;box-shadow:0 30px 60px -24px #0a2a2e66,0 0 0 1px var(--line),0 0 0 9px #fff,0 0 0 10px var(--line)}
.side{background:#ffffffee;border:1px solid var(--line);box-shadow:0 14px 30px -14px #0a2a2e44}
.side a{color:var(--td)}
.side a:hover{background:var(--cream2)}
.side .logo{background:#fff;border:1px solid var(--line)}
.side .cta{background:var(--t)}
.roam{opacity:.05}

/* day / language switches: calm glass pills */
.tgl,#themeBtn,html[data-theme="dark"] #themeBtn,.lg,html[data-lang="en"] .lg{
 background:#ffffffb8;color:var(--ink);border:1px solid #1c2d3014;box-shadow:0 8px 22px -10px #0a2a2e55;
 -webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);font-weight:600;width:112px;height:38px}
html[data-theme="dark"] #themeBtn{background:#0a2a2eb8;color:#e8f6f5;border-color:#ffffff1a}
.tgl .tk{width:28px;height:28px;top:4px;right:4px;box-shadow:0 2px 8px #0a2a2e44;background:#fff}
html[data-theme="dark"] #themeBtn .tk{right:calc(100% - 32px)}
html[data-lang="en"] .lg .tk{right:calc(100% - 32px)}
.tgl .tl{padding:0 38px 0 10px}
html[data-theme="dark"] #themeBtn .tl,html[data-lang="en"] .lg .tl{padding:0 10px 0 38px}
.tgl svg{width:17px;height:17px}
#themeBtn .i-sun{stroke:var(--gold);stroke-width:2}
#themeBtn .i-sun circle{fill:var(--gold)}
#themeBtn .i-moon{fill:#6b7a86;stroke:#6b7a86}
.lg .tk b,html[data-lang="en"] .lg .tk b{color:var(--td);font-size:.72rem}

/* footer: deep turquoise-ink, champagne headings, no neon */
footer.sitefoot,body.home footer.sitefoot,html[data-theme="dark"] footer.sitefoot{background:#0a2a2e;color:#b7cccd}
footer.sitefoot::before{content:"";position:absolute;inset:0 0 auto 0;height:3px;background:linear-gradient(90deg,var(--t),var(--gold),var(--t))}
.sf-col h4{color:#fff;font-weight:700}
.sf-col h4 .fi{border-color:var(--gold)}
.sf-col h4 .fi svg,.sf-line svg{stroke:var(--gold)}
.sf-line{color:#b7cccd}
.sf-line a,.sf-links a{color:#b7cccd}
.sf-line a:hover,.sf-links a:hover{color:var(--gold-l)}
.sf-mail{border-color:#ffffff33;background:#ffffff0d}
.sf-mail button{background:var(--gold)}.sf-mail button:hover{background:var(--gold-l)}
.sf-mail button svg{stroke:#0a2a2e}
.fpost,.fpost b{color:#e2eeee}
.fpost small{color:#7f9a9c}
.fpost img{border-color:#ffffff22}
.fpost:hover b{color:var(--gold-l)}
.sf-bottom{border-top-color:#ffffff1f;color:#7f9a9c}

/* forms */
.formbox input,.formbox select,.formbox textarea,.cph input{border:1px solid var(--line);border-radius:12px;background:#fff}
.formbox input:focus,.formbox textarea:focus,.formbox select:focus{outline:none;border-color:var(--t);box-shadow:0 0 0 4px #12a7ae22}
.upbox{background:var(--cream);border-color:var(--gold-l)}

/* ---- dark: deep turquoise-ink instead of green ---- */
html[data-theme="dark"]{--t:#2cc3c9;--td:#8fe3e6;--tl:#12363b;--ink:#e8f3f3;--gold:#d3b676;--gold-l:#8a7343;--cream:#0a1d20;--cream2:#10282c;--line:#1e3b40}
html[data-theme="dark"] body,html[data-theme="dark"] body.home,html[data-theme="dark"] body.blogpage,html[data-theme="dark"] body.orderpage,html[data-theme="dark"] body.gpage{background:var(--cream)}
html[data-theme="dark"] .plain,html[data-theme="dark"] body.home .plain{background:var(--cream)}
html[data-theme="dark"] .plain:nth-of-type(even),html[data-theme="dark"] body.home .plain:nth-of-type(even){background:#0d2528}
html[data-theme="dark"] .box,html[data-theme="dark"] .card{background:#102a2e;border-color:var(--line);box-shadow:0 14px 34px -16px #000a}
html[data-theme="dark"] .plain:nth-of-type(even) .box{background:#0a1d20}
html[data-theme="dark"] .box b{background:transparent;border-color:var(--gold-l)}
html[data-theme="dark"] h1{color:#fff}
html[data-theme="dark"] .sub{color:#8fa8aa}
html[data-theme="dark"] .tag,html[data-theme="dark"] .hero .tag{background:#0a1d20;color:var(--gold);border-color:var(--gold-l)}
html[data-theme="dark"] .side,html[data-theme="dark"] .dhead,html[data-theme="dark"] .pbody,html[data-theme="dark"] .obox{background:#0d2528ee;border-color:var(--line)}
html[data-theme="dark"] .side .logo{background:#0a1d20}
html[data-theme="dark"] .formbox input,html[data-theme="dark"] .formbox select,html[data-theme="dark"] .formbox textarea,html[data-theme="dark"] .cph input{background:#0a1d20;border-color:var(--line);color:var(--ink)}
html[data-theme="dark"] .vframe{box-shadow:0 30px 60px -24px #000c,0 0 0 1px var(--line),0 0 0 9px #0d2528,0 0 0 10px var(--line)}
html[data-theme="dark"] .vside,html[data-theme="dark"] .dgrid{background:var(--cream)}
html[data-theme="dark"] .more,html[data-theme="dark"] .fbtns .hl,html[data-theme="dark"] a.hl{color:#04191b}
html[data-theme="dark"] html[data-lang] .lg{background:#0a2a2eb8}
html[data-theme="dark"] .lg,html[data-theme="dark"][data-lang="en"] .lg{background:#0a2a2eb8;color:#e8f6f5;border-color:#ffffff1a}
html[data-theme="dark"] .sp,html[data-theme="dark"] .splash{background:#0a1d20}
html[data-theme="dark"] .side .logo{background:#f4efe4}
.tgl,#themeBtn,.lg,html[data-lang="en"] .lg{background:#ffffffe6}
html[data-theme="dark"] #themeBtn,html[data-theme="dark"] .lg,html[data-theme="dark"][data-lang="en"] .lg{background:#0a2a2ed9}
html[data-theme="dark"] footer.sitefoot{opacity:1}

/* =====================================================================
   V4.1 — gallery cleanup, order orb, mobile burger, video magnifier
   ===================================================================== */
/* gallery: no sketch effect (full-colour photos) */
body.gpage .shot::before{display:none}

/* gallery: title box -> round order button */
.dhead{overflow:hidden}
.dhead h1,.dhead p{transition:opacity .3s ease}
.dorder{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;color:#fff;opacity:0;pointer-events:none;transition:opacity .4s ease .45s;text-align:center;line-height:1.3}
.dorder svg{width:24px;height:24px}
.dorder span{font-size:.7rem;font-weight:700}
.dhead.orb{pointer-events:auto;cursor:pointer;background:var(--t);border-color:transparent;border-radius:50%;padding:0;box-shadow:0 14px 30px -8px #12a7aecc;
 transition:left .9s cubic-bezier(.65,0,.25,1),top .9s cubic-bezier(.65,0,.25,1),width .9s cubic-bezier(.65,0,.25,1),height .9s cubic-bezier(.65,0,.25,1),border-radius .9s,background .5s,padding .9s,box-shadow .5s!important}
.dhead.orb h1,.dhead.orb p{opacity:0}
.dhead.orb .dorder{opacity:1;pointer-events:auto}
.dhead.orb:hover{background:var(--td);box-shadow:0 18px 36px -8px #0a5f68cc}
.dhead.orb.done{position:fixed;left:18px;right:auto;top:auto;bottom:22px;width:76px;height:76px;transform:none;max-width:none;transition:background .3s,box-shadow .3s!important;animation:orbpop .5s ease}
@keyframes orbpop{0%{transform:scale(.85)}60%{transform:scale(1.08)}100%{transform:scale(1)}}
html[data-theme="dark"] .dhead.orb{background:var(--t)}
html[data-theme="dark"] .dorder{color:#04191b}
@media(max-width:800px){.dhead.orb.done{left:14px;bottom:calc(84px + env(safe-area-inset-bottom))}}

/* mobile: bottom bar folds into a burger icon */
.burger{display:none}
@media(max-width:800px){
 .side{transform-origin:50% 100%;transition:transform .45s cubic-bezier(.5,0,.2,1),opacity .35s ease}
 .side.mini{transform:translateX(-50%) scale(.15);opacity:0;pointer-events:none}
 .burger{display:grid;place-items:center;position:fixed;z-index:41;left:50%;bottom:calc(10px + env(safe-area-inset-bottom));width:52px;height:52px;margin-left:-26px;border-radius:50%;border:1px solid var(--line);background:#ffffffee;color:var(--td);box-shadow:0 14px 30px -12px #0a2a2e66;cursor:pointer;
  opacity:0;transform:scale(.3);pointer-events:none;transition:opacity .35s ease .15s,transform .45s cubic-bezier(.3,1.4,.5,1) .15s;-webkit-tap-highlight-color:transparent}
 .burger.on{opacity:1;transform:scale(1);pointer-events:auto}
 .burger svg{width:24px;height:24px;stroke-width:2.2}
 html[data-theme="dark"] .burger{background:#0d2528ee;color:var(--td)}
}

/* home video: dental-mirror cursor that opens into a loupe */
.vzoom{position:absolute;inset:0;overflow:hidden;-webkit-mask-image:linear-gradient(to right,#000 0%,#000 62%,transparent 100%);mask-image:linear-gradient(to right,#000 0%,#000 62%,transparent 100%)}
.vframe video{-webkit-mask-image:none;mask-image:none}
@media(hover:hover){.vframe{cursor:none}.vframe .vlinks a,.vframe .vlinks{cursor:pointer}}
@media(max-width:800px){.vzoom{-webkit-mask-image:none;mask-image:none}}
.mlens{position:fixed;left:0;top:0;z-index:70;pointer-events:none;direction:ltr;opacity:0;transition:opacity .25s ease;will-change:transform}
.mlens.on{opacity:1}
.mlens.on.away{opacity:0}
.mhead{position:absolute;left:0;top:0;width:var(--d);height:var(--d);margin:calc(var(--d)/-2) 0 0 calc(var(--d)/-2);border-radius:50%;overflow:hidden;background:#d9f3f4;
 border:3px solid #fff;box-shadow:0 0 0 1.5px #b8985a,0 10px 28px -6px #0a2a2eaa,0 0 24px #12a7ae66,inset 0 0 18px #0a5f6855;
 transition:width .6s cubic-bezier(.3,1.5,.45,1),height .6s cubic-bezier(.3,1.5,.45,1),margin .6s cubic-bezier(.3,1.5,.45,1),box-shadow .4s}
.mlens.open .mhead{box-shadow:0 0 0 2px #b8985a,0 22px 50px -10px #0a2a2ecc,0 0 46px #12a7aeaa,inset 0 0 30px #0a5f6877}
.mhead canvas{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);max-width:none;filter:contrast(1.9) saturate(2.4) brightness(.97)}
.mscan{position:absolute;left:0;right:0;height:34%;top:-34%;z-index:2;background:linear-gradient(to bottom,transparent,#7ff0f555 70%,#7ff0f5cc 98%,#fff 100%);border-bottom:1.5px solid #fff;opacity:0;pointer-events:none}
.mlens.open .mscan{opacity:1;animation:mscan 2.4s cubic-bezier(.5,0,.5,1) infinite}
@keyframes mscan{0%{top:-34%}55%,100%{top:100%}}
.mshine{position:absolute;inset:0;border-radius:50%;background:linear-gradient(115deg,transparent 35%,#ffffffbb 48%,#fff9 52%,transparent 65%);transform:translateX(-120%);animation:mshine 2.8s ease-in-out infinite}
.mlens.open .mshine{animation-duration:1.8s}
@keyframes mshine{0%,35%{transform:translateX(-120%)}75%,100%{transform:translateX(120%)}}
.mglow{position:absolute;inset:0;border-radius:50%;background:radial-gradient(circle at 30% 24%,#ffffffaa 0,#ffffff00 38%),radial-gradient(circle at 50% 50%,transparent 62%,#0a5f6844 100%)}
.mh{position:absolute;left:0;top:0;transform:rotate(48deg);transform-origin:0 0}
.mhandle{position:absolute;left:calc(var(--d,46px)/2 + 2px);top:-5px;width:74px;height:10px;border-radius:6px;background:linear-gradient(#f3f6f7,#9aa9ae 55%,#6b7c82);box-shadow:0 4px 8px #0a2a2e55;transition:left .6s cubic-bezier(.3,1.5,.45,1)}
.mlens .mh{--d:46px}
.mlens.open .mh{--d:var(--D)}
.mhandle::after{content:"";position:absolute;right:-2px;top:-1px;width:26px;height:12px;border-radius:6px;background:linear-gradient(#17b3bb,#0a5f68)}
.msp{position:absolute;left:0;top:0;background:currentColor;clip-path:polygon(50% 0,62% 38%,100% 50%,62% 62%,50% 100%,38% 62%,0 50%,38% 38%);filter:drop-shadow(0 0 4px currentColor)}
.mrip{position:absolute;left:0;top:0;border-radius:50%;border:2px solid #7ff0f5;box-shadow:0 0 18px #7ff0f5}
.mtip{position:absolute;left:34px;top:-48px;white-space:nowrap;background:var(--t);color:#fff;font-size:.78rem;padding:1px 12px;border-radius:20px;opacity:0;transform:translateY(6px);transition:opacity .3s,transform .3s;box-shadow:0 6px 14px -4px #12a7ae99}
.mtip.vis{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){.mshine{animation:none}}

/* contact anchor from the side bar */
#fcontact{scroll-margin-top:24px}
@media(max-width:800px){#fcontact{scroll-margin-top:calc(42vh + 18px)}}
#fcontact:target .sf-line{animation:fpulse 1.4s ease 2}
@keyframes fpulse{0%,100%{background:transparent}40%{background:#5eead433;box-shadow:0 0 0 6px #5eead433;border-radius:10px}}

/* =====================================================================
   V5 EXPERIMENT — creative effects + spacing (delete this block and the fx.js tag to revert to V4.2)
   ===================================================================== */

/* 1. order stamp */
.fxst{position:fixed;inset:0;z-index:300;display:grid;place-items:center;background:#0a2a2e99;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);opacity:0;transition:opacity .4s;cursor:pointer}
.fxst.on{opacity:1}
.fxpaper{position:relative;width:min(86vw,340px);padding:34px 28px 120px;background:#fffdf8;border-radius:6px;text-align:center;box-shadow:0 30px 70px -10px #000a;transform:rotate(-2deg) translateY(30px);opacity:0;
 background-image:repeating-linear-gradient(transparent 0 31px,#12a7ae22 31px 32px)}
.fxst.on .fxpaper{animation:fxpaper .55s cubic-bezier(.2,.9,.3,1.2) forwards,fxshake .35s .56s ease-out}
.fxpaper h3{font-size:1.25rem;color:#0a5f68;margin-bottom:6px}
.fxpaper p{font-size:.9rem;color:#4b5f62;line-height:1.9}
.fxl{display:block;height:7px;border-radius:4px;background:#e8e2d4;margin:10px auto 0}
.fxl.a{width:70%;margin-top:22px}.fxl.b{width:55%}.fxl.c{width:80%}.fxl.d{width:40%}
.fxseal{position:absolute;left:50%;bottom:16px;width:104px;margin-left:-52px;opacity:0;mix-blend-mode:multiply;filter:drop-shadow(0 0 1px #0a5f68)}
.fxst.on .fxseal{animation:fxseal .5s .5s cubic-bezier(.2,.9,.3,1.3) forwards}
.fxring{position:absolute;left:50%;bottom:68px;width:60px;height:60px;margin-left:-30px;border-radius:50%;border:3px solid #12a7ae;opacity:0}
.fxst.on .fxring{animation:fxring .8s .62s ease-out}
@keyframes fxpaper{to{transform:rotate(-2deg);opacity:1}}
@keyframes fxshake{0%,100%{transform:rotate(-2deg)}30%{transform:rotate(-2deg) translateY(6px)}60%{transform:rotate(-2.6deg) translateY(-2px)}}
@keyframes fxseal{0%{opacity:0;transform:scale(2.6) rotate(-35deg)}70%{opacity:.95;transform:scale(.94) rotate(-12deg)}100%{opacity:.92;transform:scale(1) rotate(-12deg)}}
@keyframes fxring{0%{opacity:.8;transform:scale(.5)}100%{opacity:0;transform:scale(5)}}
html[data-theme="dark"] .fxseal{mix-blend-mode:normal;filter:none;background:#fff;border-radius:50%;padding:4px}

/* 2. before/after streak + hint */
.cmp .fxsh{position:absolute;top:-10%;bottom:-10%;right:var(--p);width:120px;margin-right:-60px;z-index:2;pointer-events:none;opacity:0;transform:skewX(-14deg);transition:opacity .35s;
 background:linear-gradient(90deg,transparent,#ffffff55 40%,#ffffffcc 50%,#ffffff55 60%,transparent);mix-blend-mode:soft-light}
.cmp.mv .fxsh{opacity:1}
.cmp.hint .line::after{animation:fxpulse 1s ease-in-out infinite}
@keyframes fxpulse{0%,100%{box-shadow:0 0 0 0 #12a7aeaa}50%{box-shadow:0 0 0 12px #12a7ae00}}

/* 3. stats keys */
.st{position:relative;overflow:hidden}
.st::after{content:"";position:absolute;left:18%;right:18%;bottom:0;height:3px;border-radius:3px;background:linear-gradient(90deg,var(--t),var(--gold));transform:scaleX(0);transition:transform .6s .25s}
.st.pre{opacity:.3;transform:translateY(8px)}
.st{transition:opacity .4s,transform .4s,box-shadow .4s}
.st.press{animation:fxkey .55s ease-out}
.st.press::after{transform:scaleX(1)}
@keyframes fxkey{0%{transform:translateY(8px)}35%{transform:translateY(5px) scale(.97);box-shadow:inset 0 0 0 2px #12a7aeaa,0 0 28px #12a7ae66}100%{transform:none}}

/* 4. spotlight + tilt */
.box{position:relative}
.box::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .3s;background:radial-gradient(280px circle at var(--mx,50%) var(--my,50%),#12a7ae26,transparent 65%)}
@media(hover:hover){
 .box:hover::before{opacity:1}
 .box{transition:transform .18s ease-out,box-shadow .3s,border-color .3s}
 .box:hover{transform:perspective(900px) translateY(-5px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg))}
}

/* 5. titles: word reveal + drawn gold line */
.title.fx .fw{display:inline-block;opacity:0;transform:translateY(.55em);filter:blur(7px);transition:opacity .6s,transform .6s cubic-bezier(.2,.8,.2,1),filter .6s;transition-delay:calc(var(--i)*110ms)}
.title.fx.in .fw{opacity:1;transform:none;filter:none}
.title.fx::after{transform:scaleX(0);transform-origin:100% 50%;transition:transform .9s cubic-bezier(.6,0,.2,1) .35s}
html[dir="ltr"] .title.fx::after{transform-origin:0 50%}
.title.fx.in::after{transform:scaleX(1)}

/* 6. theme wave (View Transitions) */
::view-transition-old(root),::view-transition-new(root){animation:none;mix-blend-mode:normal}
::view-transition-old(root){z-index:1}
::view-transition-new(root){z-index:2}

/* 7. lightbox page-turn + twinkle */
.lb{perspective:1500px}
.lb.open .lbfig{animation:fxflip .9s cubic-bezier(.2,.8,.2,1) both;transform-origin:100% 50%}
@keyframes fxflip{0%{transform:rotateY(-78deg) scale(.8);opacity:0;filter:brightness(.4)}60%{opacity:1}100%{transform:none;filter:none}}
.fxspark{position:absolute;width:30px;height:30px;margin:-15px 0 0 -15px;z-index:3;background:#fff;pointer-events:none;opacity:0;clip-path:polygon(50% 0,60% 40%,100% 50%,60% 60%,50% 100%,40% 60%,0 50%,40% 40%);filter:drop-shadow(0 0 6px #fff);animation:fxtw 1.4s ease-in-out infinite}
@keyframes fxtw{0%,100%{opacity:0;transform:scale(0) rotate(0)}45%{opacity:1;transform:scale(1.1) rotate(45deg)}70%{opacity:0;transform:scale(.4) rotate(90deg)}}

/* 8. splash smile line */
.sp-line{display:block;width:min(56vw,230px);margin:14px auto 0;overflow:visible}
.sp-line path{fill:none;stroke-linecap:round}
.sp-line .tr{stroke:#12a7ae26;stroke-width:5}
.sp-line .dr{stroke:#12a7ae;stroke-width:5;stroke-dasharray:1;stroke-dashoffset:1}
.sp-line .st4{fill:#b8985a;stroke:none;opacity:0;transform-box:fill-box;transform-origin:center}
html.sp .sp-line .dr{animation:fxdraw 3.3s cubic-bezier(.45,.05,.4,1) forwards}
html.sp .sp-line .st4{animation:fxstar .7s 3.2s ease-out forwards}
@keyframes fxdraw{to{stroke-dashoffset:0}}
@keyframes fxstar{0%{opacity:0;transform:scale(0) rotate(0)}50%{opacity:1;transform:scale(1.5) rotate(90deg)}100%{opacity:1;transform:scale(1) rotate(180deg)}}
html[data-theme="dark"] .sp-line .dr{stroke:#2dd4bf}

/* footer: one column on phones + call button */
.sf-callbtn{display:none;margin-inline-start:10px;padding:1px 16px;border-radius:20px;background:var(--t);color:#fff!important;font-weight:700;font-size:.82rem;text-decoration:none!important}
@media(max-width:800px){
 body.home .sf-grid,.sf-grid{grid-template-columns:1fr;gap:34px}
 .sf-callbtn{display:inline-block}
 .sf-line{flex-wrap:wrap}
 footer.sitefoot{line-height:2.1}
 .fpost b{font-size:.95rem}
}

/* home: shorter video strip on phones */
@media(max-width:800px){
 body.home .vside{height:30vh}
 #fcontact{scroll-margin-top:calc(30vh + 18px)}
}

/* home: "why us" cards in two columns with an icon on top */
body.home .cards.trustc{grid-template-columns:repeat(2,minmax(0,1fr));max-width:680px;gap:16px}
body.home .cards.trustc .box,html[dir="ltr"] body.home .cards.trustc .box{text-align:center;padding:24px 16px}
.trustc .box:last-child{grid-column:1/-1}
.trustc .ic{display:grid;place-items:center;width:50px;height:50px;border-radius:50%;margin:0 auto 12px;background:#12a7ae1a;color:var(--td);border:1px solid var(--gold-l)}
.trustc .ic svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.trustc h3{font-size:1rem;margin-bottom:6px}
.trustc p{font-size:.88rem;line-height:1.9}
@media(max-width:520px){body.home .cards.trustc{gap:12px}.trustc .box{padding:20px 12px!important}.trustc h3{font-size:.92rem}.trustc p{font-size:.82rem}}

/* tighter section rhythm (~20 %) */
@media(min-width:801px){
 body.home .plain{padding-top:76px;padding-bottom:76px}
 body.home .plain.first{padding-top:80px}
 .plain{padding-top:78px;padding-bottom:78px}
 .title::after{margin-top:10px}
}
@media(max-width:800px){body.home .plain{padding-top:42px;padding-bottom:42px}}

/* video: gallery link moves to the top edge (desktop) */
@media(min-width:801px){.vlinks{bottom:auto;top:22px}}

/* home: floating round order button */
.fxorb{position:fixed;left:18px;bottom:22px;z-index:44;width:72px;height:72px;border-radius:50%;background:var(--t);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;text-decoration:none;
 box-shadow:0 14px 30px -8px #12a7aecc;opacity:0;transform:scale(.4) translateY(30px);pointer-events:none;transition:opacity .35s,transform .5s cubic-bezier(.3,1.5,.5,1),background .3s}
.fxorb.on{opacity:1;transform:none;pointer-events:auto}
.fxorb:hover{background:var(--td)}
.fxorb svg{width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.fxorb span{font-size:.66rem;font-weight:700;line-height:1.3}
.fxorb.on::after{content:"";position:absolute;inset:0;border-radius:50%;border:2px solid var(--t);animation:fxorb 2.6s ease-out infinite;pointer-events:none}
@keyframes fxorb{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.7);opacity:0}}
html[data-theme="dark"] .fxorb{color:#04191b}
@media(max-width:800px){.fxorb{left:14px;bottom:calc(86px + env(safe-area-inset-bottom));width:60px;height:60px}.fxorb svg{width:20px;height:20px}.fxorb span{font-size:.58rem}}

@media(prefers-reduced-motion:reduce){.fxorb.on::after,.sp-line .dr{animation:none}.sp-line .dr{stroke-dashoffset:0}}
@media(min-width:801px){.vlinks{left:auto;right:26px;padding:0}}
body.home .stats{max-width:680px}

/* =====================================================================
   V6 — mobile hamburger (top-left), no floating order button on mobile,
        plan zoom, footer SMS box, AI editor
   ===================================================================== */
.burger{display:none}
@media(max-width:800px){
 /* the menu becomes a drop-down panel that grows out of the burger */
 .side{left:10px;right:auto;top:64px;bottom:auto;transform:scale(.2);transform-origin:0 0;flex-direction:column;align-items:stretch;gap:2px;padding:8px;width:max-content;max-width:78vw;border-radius:22px;opacity:0;pointer-events:none;transition:transform .35s cubic-bezier(.3,1.3,.5,1),opacity .25s ease;z-index:60}
 .side.open{transform:none;opacity:1;pointer-events:auto}
 .side a{width:auto;height:44px;display:flex;align-items:center;gap:12px;padding:0 14px 0 10px;border-radius:14px;justify-content:flex-start}
 .side a svg{width:22px;height:22px;flex:none}
 .side .logo{margin:0;padding:0 10px}.side .logo img{width:30px;height:30px}
 .side .cta{margin:0}
 .side a[data-tip]::after{display:inline;position:static;transform:none;opacity:1;background:none;color:inherit;padding:0;font-size:.92rem;font-weight:700;pointer-events:auto}
 .burger{display:grid;place-items:center;position:fixed;z-index:61;left:10px;top:10px;bottom:auto;margin:0;width:46px;height:46px;border-radius:50%;border:1px solid var(--line);background:#ffffffee;color:var(--td);box-shadow:0 10px 24px -10px #0a2a2e77;cursor:pointer;opacity:1;transform:none;pointer-events:auto;-webkit-tap-highlight-color:transparent;transition:background .25s}
 .burger svg{width:24px;height:24px;stroke-width:2.2;grid-area:1/1;transition:transform .3s,opacity .2s}
 .burger .b2{opacity:0;transform:rotate(-90deg)}
 .burger.x .b1{opacity:0;transform:rotate(90deg)}
 .burger.x .b2{opacity:1;transform:none}
 .burger.x{background:var(--t);color:#fff}
 html[data-theme="dark"] .burger{background:#0d2528ee}
 html[data-theme="dark"] .burger.x{background:var(--t);color:#04191b}
 /* no floating order buttons on mobile (the order link stays inside the menu) */
 .fxorb,.dorder,.dhead.orb.done{display:none!important}
 .wa{bottom:calc(16px + env(safe-area-inset-bottom))}
 .blogmain,.post{padding-bottom:70px}
 .fixlinks{bottom:24px}
}

/* plan form on mobile: whole sheet by default, zoom with + / − / pinch */
.zbar{display:none}
@media(max-width:800px){
 .zbar{display:flex;justify-content:center;align-items:center;gap:10px;margin:6px auto 10px;position:sticky;top:8px;z-index:30;width:max-content;padding:6px 8px;border-radius:30px;background:#ffffffe8;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid var(--line);box-shadow:0 10px 24px -12px #0a2a2e66}
 .zbar button{height:38px;min-width:38px;padding:0 12px;border-radius:19px;border:1px solid var(--line);background:#fff;color:var(--td);font:700 1.15rem/1 inherit;font-family:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;cursor:pointer;-webkit-tap-highlight-color:transparent}
 .zbar .zfit{font-size:.82rem}.zbar .zfit svg{width:16px;height:16px;stroke-width:2.2}
 .zbar .zfit.on{background:var(--t);color:#fff;border-color:var(--t)}
 .swrap{overflow:auto;touch-action:pan-x pan-y;padding:4px;-webkit-overflow-scrolling:touch}
 .swrap .stage{min-width:0;max-width:none;width:calc(var(--z,1)*100%)}
 .shintm{display:block;margin-top:6px}
}
html[data-theme="dark"] .zbar{background:#0d2528ee}
html[data-theme="dark"] .zbar button{background:#12302f;color:var(--td)}

/* footer: SMS box */
.sf-sms{margin-top:10px}
.sf-sms input{direction:ltr;text-align:right}
html[dir="ltr"] .sf-sms input{text-align:left}
.sf-note{margin:8px 0 0;font-size:.72rem;line-height:1.8;color:#8fcfc7;opacity:.85}

/* ===== AI editor (blog submit page) ===== */
.aiwrap{margin-top:-4px;text-align:right}
.aibar{display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.aibtnw{position:relative;display:inline-block}
.aibtn{display:inline-flex;align-items:center;gap:8px;height:44px;padding:0 20px;border:0;border-radius:24px;cursor:pointer;font:700 .95rem inherit;font-family:inherit;color:#fff;background:linear-gradient(120deg,var(--t),#0a8f96 55%,var(--gold));background-size:200% 100%;box-shadow:0 12px 26px -12px #12a7aecc;transition:background-position .5s,transform .2s,box-shadow .2s}
.aibtn:hover{background-position:100% 0;transform:translateY(-1px)}
.aibtn svg{width:20px;height:20px;stroke-width:2}
.aibtn:disabled{opacity:.7;cursor:progress}
.aibtn.busy svg{animation:aispin 1s linear infinite}
@keyframes aispin{to{transform:rotate(360deg)}}
.aitip{position:absolute;z-index:20;right:0;bottom:calc(100% + 12px);width:min(320px,80vw);padding:12px 14px;border-radius:16px;background:var(--td,#0a5f68);color:#fff;font-size:.82rem;line-height:1.9;text-align:right;box-shadow:0 18px 40px -14px #0a2a2eaa;opacity:0;transform:translateY(6px);pointer-events:none;transition:opacity .2s,transform .2s}
.aitip .aih{display:block;margin-bottom:2px;color:#99f6e4;font-size:.86rem;font-weight:800}.aitip .aib{display:block}
.aiwrap .aih{font-weight:800;color:var(--td);font-size:.92rem}.aitip .aih{color:#99f6e4}
.aitip::after{content:"";position:absolute;right:26px;top:100%;border:7px solid transparent;border-top-color:var(--td,#0a5f68)}
.aibtnw:hover .aitip,.aibtn:focus-visible+.aitip{opacity:1;transform:none}
.aimodes{display:flex;flex-wrap:wrap;gap:6px}
.aimode{height:34px;padding:0 14px;border-radius:17px;border:1px solid var(--line);background:#fff;color:var(--td);font:600 .8rem inherit;font-family:inherit;cursor:pointer;transition:.2s}
.aimode.on{background:var(--cream2,#e6f6f5);border-color:var(--t);color:var(--td);box-shadow:0 0 0 3px #12a7ae22}
.aidesc{margin:8px 2px 0;font-size:.78rem;opacity:.7}
.aistat{display:none;margin:8px 0 0;font-size:.84rem;color:var(--td)}.aistat.show{display:block}.aistat.bad{color:#b3261e}
.aistat .aisec{margin-inline-start:6px}
.airesult{margin-top:12px;padding:14px;border-radius:20px;border:1px solid var(--line);background:#ffffffcc}
.airesult[hidden]{display:none}
.aiout{width:100%;margin-top:8px;font:inherit;font-size:.9rem;line-height:2;padding:10px 12px;border-radius:14px;border:1px solid var(--line);background:#fff;color:inherit;resize:vertical}
.aiacts{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}
.aiacts .hl{height:40px;padding:0 20px;font-size:.88rem}
.aisec{height:36px;padding:0 14px;border-radius:18px;border:1px solid var(--line);background:#fff;color:var(--td);font:600 .8rem inherit;font-family:inherit;cursor:pointer}
.aiseo,.ainotes{margin-top:14px;padding-top:12px;border-top:1px dashed var(--line);font-size:.84rem}
.aiseo dl{margin:6px 0 0;display:grid;grid-template-columns:max-content 1fr;gap:6px 14px}
.aiseo dt{font-weight:700;color:var(--td)}.aiseo dd{margin:0;line-height:1.9}.aiseo dd i{opacity:.55;font-style:normal;font-size:.74rem}
.aikw{display:inline-block;margin:0 0 4px 6px;padding:1px 10px;border-radius:12px;background:var(--cream2,#e6f6f5);color:var(--td);font-size:.78rem}
.ainotes ul{margin:6px 0 0;padding:0 18px 0 0;line-height:2}
@media(max-width:560px){.aiseo dl{grid-template-columns:1fr}.aiseo dt{margin-top:4px}.aitip{right:auto;left:0}.aitip::after{right:auto;left:26px}}
html[data-theme="dark"] .aimode,html[data-theme="dark"] .aisec{background:#12302f;color:var(--td)}
html[data-theme="dark"] .airesult{background:#0d2528cc}
html[data-theme="dark"] .aiout{background:#0b1f1d}
html[data-theme="dark"] .aimode.on{background:#16403f}

@media(max-width:800px){.dhead{max-width:calc(100vw - 150px);padding-left:14px;padding-right:14px}}
@media(max-width:800px){.dhead p{display:none}.dhead{max-width:calc(100vw - 140px)}}

/* ===== V6 · faq (سؤالات متداول) — remove this block + #faq section to drop it ===== */
.faq{max-width:860px;margin:30px auto 0;text-align:right;display:grid;gap:12px}
.qa{background:#fff;border:1px solid #0d948833;border-radius:20px;box-shadow:0 8px 24px #0d94881a;transition:box-shadow .3s,border-color .3s}
.qa[open]{box-shadow:0 14px 36px #0d948833;border-color:var(--gold,#B8985A)}
.qa summary{list-style:none;cursor:pointer;position:relative;padding:16px 22px;padding-inline-end:58px;font-weight:700;color:var(--td,#0A5F68);line-height:1.9}
.qa summary::-webkit-details-marker{display:none}
.qa summary::after{content:"+";position:absolute;inset-inline-end:18px;top:50%;width:28px;height:28px;margin-top:-14px;border-radius:50%;background:var(--tl,#e6f7f5);color:var(--t,#12A7AE);display:grid;place-items:center;font-size:1.2rem;line-height:1;transition:transform .3s,background .3s,color .3s}
.qa[open] summary::after{content:"–";background:var(--t,#12A7AE);color:#fff;transform:rotate(180deg)}
.qa-a{padding:0 22px 18px;line-height:2.1;opacity:.88;animation:qaIn .35s ease}
.qa-a a{color:var(--t,#12A7AE);text-decoration:underline;text-underline-offset:4px}
@keyframes qaIn{from{opacity:0;transform:translateY(-6px)}to{opacity:.88;transform:none}}
/* ===== V6 · consult form ===== */
.cform{max-width:760px;margin:30px auto 0;text-align:right;display:grid;grid-template-columns:1fr 1fr;gap:16px;position:relative}
.cform:hover{transform:none}
.cform label{display:flex;flex-direction:column;gap:6px;font-size:.92rem;font-weight:700;color:var(--td,#0A5F68)}
.cform .full{grid-column:1/-1}
.cform input,.cform select,.cform textarea{font:inherit;font-weight:400;color:inherit;background:#fff;border:1.5px solid #0d948840;border-radius:14px;padding:10px 14px;outline:none;transition:border-color .2s,box-shadow .2s}
.cform input:focus,.cform select:focus,.cform textarea:focus{border-color:var(--t,#12A7AE);box-shadow:0 0 0 4px #12a7ae22}
.cform textarea{resize:vertical;min-height:84px}
.cform .hp{position:absolute;left:0;top:0;width:1px;height:1px;opacity:0;pointer-events:none}
.cform .cact{display:flex;align-items:center;gap:16px;flex-wrap:wrap}
.cform .more{margin:0;border:0;cursor:pointer;font:inherit;font-weight:700}
.cform .more[disabled]{opacity:.55;pointer-events:none}
.cmsg{margin:0;font-size:.92rem;opacity:0;transition:opacity .3s;color:#b3261e}
.cmsg.show{opacity:1}.cmsg.ok{color:#0f766e}
.hpposts{text-align:right}
.sf-col h4 a{color:inherit}
/* ===== V6 · splash (click on empty area) + cornerflip (click a box corner) ===== */
.fxlayer{position:fixed;inset:0;pointer-events:none;z-index:9998;overflow:hidden}
.fxp{position:absolute;left:0;top:0;will-change:transform,opacity;font-style:normal;line-height:1}
.fxcorner{cursor:alias}
.fxspin{animation:fxspinY .9s cubic-bezier(.45,.05,.25,1)}
.fxspinx{animation:fxspinX .9s cubic-bezier(.45,.05,.25,1)}
@keyframes fxspinY{from{transform:perspective(900px) rotateY(0)}to{transform:perspective(900px) rotateY(360deg)}}
@keyframes fxspinX{from{transform:perspective(900px) rotateX(0)}to{transform:perspective(900px) rotateX(360deg)}}
.box.fxspin:hover{animation-name:fxspinYh}.box.fxspinx:hover{animation-name:fxspinXh}
@keyframes fxspinYh{from{transform:perspective(900px) rotateY(0) scale(1.1)}to{transform:perspective(900px) rotateY(360deg) scale(1.1)}}
@keyframes fxspinXh{from{transform:perspective(900px) rotateX(0) scale(1.1)}to{transform:perspective(900px) rotateX(360deg) scale(1.1)}}
@media(hover:none){.box.fxspin:hover{animation-name:fxspinY}.box.fxspinx:hover{animation-name:fxspinX}}
@media(max-width:700px){.cform{grid-template-columns:1fr;padding:20px}.qa summary{padding:14px 16px;padding-inline-end:54px}.qa-a{padding:0 16px 16px}}
html[data-theme="dark"] .qa{background:#0e2a26;border-color:#2dd4bf40;box-shadow:0 8px 24px #00000059}
html[data-theme="dark"] .qa summary{color:#bff3ec}
html[data-theme="dark"] .qa summary::after{background:#16403f;color:#5eead4}
html[data-theme="dark"] .qa[open] summary::after{background:#12A7AE;color:#fff}
html[data-theme="dark"] .cform label{color:#bff3ec}
html[data-theme="dark"] .cform input,html[data-theme="dark"] .cform select,html[data-theme="dark"] .cform textarea{background:#0b1f1d;border-color:#2dd4bf55;color:#e6f7f5}
html[data-theme="dark"] .cmsg.ok{color:#5eead4}
/* ===== V6 · home articles: compact horizontal cards ===== */
body.home .hpposts{max-width:640px;gap:16px}
.hpposts .bcard{display:grid;grid-template-columns:150px 1fr;grid-template-rows:auto auto auto 1fr;column-gap:18px;row-gap:2px;align-items:start;padding:12px;text-align:right}
.hpposts .bcard .bimg{grid-column:1;grid-row:1/5;margin:0;width:100%;height:auto;aspect-ratio:1/1;align-self:start}
.hpposts .bcard>:not(.bimg){grid-column:2}
.hpposts .bcard .tag{justify-self:start;margin-top:4px}
.hpposts .bcard h3{margin:2px 0;font-size:1rem}
.hpposts .bcard p{margin:0;font-size:.86rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hpposts .bcard .rm{align-self:end;font-size:.9rem;color:var(--t,#12A7AE);font-weight:700}
html[dir="ltr"] .hpposts .bcard{text-align:left}
@media(max-width:520px){.hpposts .bcard{grid-template-columns:104px 1fr;column-gap:12px}.hpposts .bcard p{display:none}}
