/* V2 · daylight, paper and architectural surfaces. No canvas or animation library. */
:root{--studio-ink:#17383e;--studio-rule:#63808226;--studio-ease:cubic-bezier(.16,.76,.24,1)}
.tr-hero,.tr-section{isolation:isolate;position:relative}
.tr-hero>.cx-container,.tr-section>.cx-container{position:relative;z-index:1}
.tr-hero{background:linear-gradient(110deg,#f5f3ee 0%,#f0f2f3 46%,#dce5ee 100%);overflow:clip}
.tr-hero:before{content:'';position:absolute;inset:0;background:linear-gradient(116deg,transparent 60%,#a3b6c233 60.15%,#fbfdfc55 68.2%,transparent 68.35%),linear-gradient(116deg,transparent 76%,#6d8b9d15 76.1%,#ffffff4f 84%,transparent 84.1%);pointer-events:none}
.tr-hero:after{content:'';position:absolute;inset:0;background-image:url('./studio-grain.svg');opacity:.26;pointer-events:none;mix-blend-mode:multiply}
.tr-section.white{background:#f7f6f2}
.tr-section.paper{background:linear-gradient(112deg,#eaf0f1,#e2eaf1 70%,#edf0ee)}
.tr-section:not(.dark):before{content:'';position:absolute;inset:0;pointer-events:none;background:url('./studio-grain.svg');opacity:.21;mix-blend-mode:multiply}
.tr-section:not(.dark):after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:0 1px 0 #fff9 inset,0 18px 34px -34px #17354580 inset;background:linear-gradient(90deg,transparent calc(100% - 40px),#73878c12 calc(100% - 39px),transparent calc(100% - 38px))}
.tr-section.dark{background:linear-gradient(113deg,#071423,#102735 68%,#112942);border-top:1px solid #adc9e227}
.tr-section.dark:not(.cx-contact):before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(90deg,transparent 0 119px,#b4cdd804 119px 120px);mask-image:linear-gradient(90deg,transparent,#000)}
.cx-section-head{position:relative}
.cx-section-head:before{content:'';height:1px;position:absolute;top:-27px;left:0;width:58px;background:#657e8d85;transform-origin:left;transform:scaleX(var(--studio-progress,1));transition:transform .12s linear}
.dark .cx-section-head:before{background:#99b8c68c}
.cx-eyebrow{color:#446e7e!important}.dark .cx-eyebrow{color:#8faed4!important}
.tr-hero-demo{padding:20px 0 0 20px}
.tr-hero-demo:before{content:'';position:absolute;inset:0 -22px 54px 0;z-index:-1;pointer-events:none;border:1px solid #ffffffb0;border-radius:22px 0 0 22px;background:linear-gradient(126deg,#f9fcfd61,#b6c8d928);box-shadow:0 1px 1px #29485813,17px 30px 60px -35px #304a6470}
.tr-hero-web{border:1px solid #b7c6d0;box-shadow:0 2px 3px #112b3310,0 9px 13px -9px #112b334d,0 28px 48px -25px #223b5266}
.tr-hero-query{border-radius:12px;box-shadow:0 2px 4px #1d354d09,0 9px 16px -12px #324a696b}
.tr-hero-email{background:linear-gradient(112deg,#fffefa,#f6f9fa);border-color:#becbd0;box-shadow:0 2px 2px #1937380a,0 16px 32px -24px #16353977}
.tr-site-brand{background:#fffefb}.tr-hero-web-foot{background:#f2f4ef}
.tr-hero-email>i{border-color:#aac7b9;background:#eff6ef;color:#557962}
.tr-browserbar{background:linear-gradient(#f0f3f6,#e5eaf0);box-shadow:0 1px 0 #fff inset}
.tr-header{box-shadow:0 1px 1px #e9f6ff3b inset,0 9px 15px -13px #081a3777,0 24px 48px -30px #12283c8c}
.cx-button{box-shadow:0 1px 1px #efffff4d inset,0 4px 6px -4px #24448799,0 15px 24px -16px #385bcc99!important;transition:transform .45s var(--studio-ease),box-shadow .45s var(--studio-ease),filter .45s!important}
.cx-button:hover,.cx-button:focus-visible{transform:translateY(-3px);box-shadow:0 1px 1px #efffff77 inset,0 6px 10px -6px #24448799,0 24px 32px -21px #385bcca6!important}
.cx-button:active{transform:translateY(0) scale(.99)}
.tr-mini-browser,.dir-catalogue-demo,.con-workbench{box-shadow:0 1px 0 #fff inset,0 3px 5px #17324206,0 16px 22px -17px #17324244,0 45px 75px -45px #17324244}
.fab-object-stage,.fab-channel-object{display:block;min-height:390px;background:linear-gradient(126deg,#f4f1e8,#e0e7e2 64%,#dce5e2);border-color:#bccdc5;border-radius:15px;box-shadow:0 1px 0 #fff inset,0 18px 28px -26px #34564c55}
.fab-object-stage:before,.fab-channel-object:before{content:'';position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(0deg,transparent 0 23px,#607b6624 23px 24px),repeating-linear-gradient(90deg,transparent 0 23px,#607b6612 23px 24px);mask-image:linear-gradient(145deg,transparent 25%,#0008)}
.fab-object-stage .fab-illustration,.fab-channel-object .fab-illustration{width:100%;max-width:none;min-height:310px;height:auto;display:block;position:relative;padding:4px 15px 30px}
.fab-object-label{border-color:#748d8044;color:#667b6d;background:#e5ece577;bottom:0;left:0;right:0;padding:17px 24px}
.fab-object-label b{color:#395c4b}
.studio-object .st-lid{transform-origin:270px 106px;transition:transform 1.1s var(--studio-ease)}
.studio-object .st-flap{transform-origin:272px 103px;transition:transform 1.1s var(--studio-ease)}
.studio-object .st-material{transition:translate .9s var(--studio-ease)}
.studio-object .st-dimension{opacity:.66;transition:opacity .7s}
.fab-object-stage:is(:hover,:focus-visible) .st-lid{transform:rotate(-5deg)}
.fab-object-stage:is(:hover,:focus-visible) .st-flap{transform:rotate(4deg)}
.fab-object-stage:is(:hover,:focus-visible) .st-material{translate:-4px 3px}
.fab-object-stage:is(:hover,:focus-visible) .st-dimension{opacity:1}
.studio-object .st-press{animation:studio-press 5.8s var(--studio-ease) infinite;animation-play-state:paused}
.studio-object .st-parcel{animation:studio-parcel 5.8s var(--studio-ease) infinite;animation-play-state:paused}
.studio-object .st-trace{animation:studio-trace 5s linear infinite;animation-play-state:paused}
.studio-object .st-led{animation:studio-led 4s ease infinite;animation-play-state:paused}
.studio-object .st-screen-line{stroke-dasharray:60;animation:studio-screen 5.8s ease infinite;animation-play-state:paused}
[data-studio-inview=true] .st-press,[data-studio-inview=true] .st-parcel,[data-studio-inview=true] .st-trace,[data-studio-inview=true] .st-led,[data-studio-inview=true] .st-screen-line{animation-play-state:running}
@keyframes studio-press{0%,18%,78%,100%{transform:translateY(0)}38%,60%{transform:translateY(8px)}}
@keyframes studio-parcel{0%,50%{transform:translate(0,0)}74%,92%{transform:translate(32px,-6px);opacity:1}96%{transform:translate(34px,-7px);opacity:0}97%{transform:translate(-22px,4px);opacity:0}100%{transform:translate(0,0);opacity:1}}
@keyframes studio-trace{to{stroke-dashoffset:-450}}
@keyframes studio-led{0%,35%,75%,100%{opacity:.55}45%,65%{opacity:1}}
@keyframes studio-screen{0%,20%{stroke-dashoffset:60;opacity:.6}65%,100%{stroke-dashoffset:0;opacity:1}}
.fab-object-stage:hover .fab-object,.fab-channel-object:hover .fab-object{transform:none}
.fab-plan-paper,.fab-order-sheet,.fab-document-sheet,.dir-trace-file,.con-dossier-sheet,.con-enquiry-sheet{background-image:url('./studio-grain.svg'),linear-gradient(112deg,#fffef8,#fafaf5 74%,#eceee7);border-color:#bfcac8;box-shadow:1px 2px 1px #80918c22,3px 5px 0 -2px #f7f7f0,4px 6px 0 -2px #b4c2bb55,0 24px 44px -29px #1d3b475e}
.fab-plan-paper{border-radius:2px}.fab-paper-clip{box-shadow:2px 2px 2px #243d4222,1px 0 0 #fff inset}
.fab-document-stack:before{background:#cddbd4;border-color:#a3b9aa}
.dir-channel-grid{gap:16px;border:0;background:transparent;border-radius:0;overflow:visible}
.dir-channel{border:1px solid #bdc9d1;border-radius:5px;background:linear-gradient(133deg,#fffef8,#f1f4ef);box-shadow:0 1px 0 #fff inset,0 10px 20px -14px #1c3c4559;overflow:visible;transition:transform .65s var(--studio-ease),box-shadow .65s,background .65s}
.dir-channel:before{content:'';height:4px;position:absolute;top:0;left:24px;right:24px;background:#8b9e9b;border-radius:0 0 2px 2px}
.dir-channel:nth-child(2):before{background:#698799}.dir-channel:nth-child(3):before{background:#7c9274}
.dir-channel:hover,.dir-channel:focus-visible{background:linear-gradient(133deg,#fffef9,#edf3ee);transform:translateY(-5px);box-shadow:0 2px 4px #1c3c4509,0 24px 32px -20px #1c3c455e}
.dir-channel .dir-drawing{max-width:330px;margin-top:24px;filter:drop-shadow(0 1px 0 #fff)}
.dir-drawing .dir-float-one{transition-duration:.9s}.dir-drawing .dir-float-two{transition-duration:1.1s}
.dir-calculator-shell{background:linear-gradient(125deg,#e7ede6,#d9e4e4 70%,#cddde4);border-color:#b8cbd0;position:relative;box-shadow:0 1px 0 #fff9 inset}
.dir-calculator{border-radius:8px;background:linear-gradient(120deg,#fffef8,#f1f5ee);box-shadow:0 1px 0 #fff inset,0 4px 4px #213e4322,0 24px 28px -22px #17333566;border-color:#b6c8c4}
.dir-check-symbol{background:linear-gradient(135deg,#fffef8,#dce7e1);border:1px solid #d0dcd3;box-shadow:0 1px 0 white inset,0 4px 7px -4px #49685955}
.con-model-wrap{background:linear-gradient(132deg,#eeeae0,#dce6e2 54%,#d7e2e7);border:1px solid #b8cbc5;box-shadow:0 1px 0 #ffffffbd inset,0 20px 28px -29px #1b404270;position:relative;overflow:hidden}
.con-model-wrap:after{content:'';position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 29px,#57787013 29px 30px),repeating-linear-gradient(90deg,transparent 0 29px,#57787013 29px 30px);mask-image:linear-gradient(140deg,transparent 35%,#000);pointer-events:none}
.con-model{position:relative;z-index:1;filter:drop-shadow(0 11px 7px #34514a12)}
.con-model-accent{transition:transform 1.1s var(--studio-ease),filter 1.1s var(--studio-ease)}
.studio-ground,.studio-structure{transition:opacity 1.2s var(--studio-ease),translate 1.2s var(--studio-ease)}
[data-studio-inview=false] .studio-structure{translate:0 -9px;opacity:.65}
[data-studio-inview=false] .studio-ground{translate:0 7px;opacity:.65}
[data-studio-inview=true] .studio-structure{transition-delay:120ms;translate:0 0;opacity:1}
[data-studio-inview=true] .studio-ground{translate:0 0;opacity:1}
.con-model-wrap:is(:hover,:focus-visible) .con-model-accent{filter:drop-shadow(0 4px 3px #354e4130);transform:translateY(-2px)}
.con-model-label,.con-model-foot{z-index:2;color:#4e746d}
.con-model-wrap:hover .con-model{transform:none}
.con-channel-tabs,.con-selector{background:#e1e8e6}.con-selector{border-radius:13px;padding:7px}
.con-channel-layout{background:linear-gradient(120deg,#fdfdf8,#f3f4ee)}
.con-channel-figure{box-shadow:0 2px 4px #26474514,0 16px 24px -18px #2647454d;border:1px solid #bcc9c0}
.con-channel-figure figcaption{background:#ecf1e9!important}
.con-dossier-cover,.fab-document-photo,.dir-renewal-photo{box-shadow:0 3px 6px #0d302114,0 18px 26px -21px #12372e80;border:1px solid #b7c7bc}
.studio-plate{position:relative;outline:none}
.studio-plate:focus-visible{outline:2px solid #7394c9;outline-offset:5px}
[data-studio-part]{transition:opacity .75s var(--studio-ease),translate .85s var(--studio-ease)}
.studio-parts-ready [data-studio-part]{opacity:.32;translate:0 13px}
.studio-parts-ready[data-studio-inview=true] [data-studio-part]{opacity:1;translate:0 0;transition-delay:calc(var(--part-order,0)*70ms)}
.studio-parts-ready [data-studio-part]:focus-within{opacity:1;translate:0 0}
.cx-faq-map{box-shadow:0 1px 0 #d5eaff17 inset,0 20px 40px -28px #0009!important}
.cx-contact{background:linear-gradient(128deg,#061421,#142c3a 66%,#112944)!important}
.cx-contact:after{content:'';position:absolute;inset:0;background:linear-gradient(125deg,transparent 62%,#8eb2d509 62.1%,#b7d4e212 63%,transparent 73%);pointer-events:none}
@media(max-width:900px){.tr-hero-demo{padding:18px 0 0 14px}.tr-hero-demo:before{inset:0 -14px 55px 0}.dir-channel-grid{gap:12px}.fab-object-stage,.fab-channel-object{min-height:330px}.fab-object-stage .fab-illustration,.fab-channel-object .fab-illustration{min-height:270px}}
@media(max-width:600px){.tr-hero-demo{padding:13px 0 0}.tr-hero-demo:before{inset:0 -7px 49px;border-radius:14px}.tr-hero:before{opacity:.65}.tr-section:not(.dark):after{background:none}.cx-section-head:before{top:-19px;width:37px}.fab-object-stage,.fab-channel-object{min-height:290px}.fab-object-stage .fab-illustration,.fab-channel-object .fab-illustration{min-height:250px;padding:9px 0 30px}.fab-object-label{padding:13px 17px;font-size:11px}.dir-channel-grid{gap:12px}.dir-channel{border-radius:9px}.dir-channel .dir-drawing{margin:0}.dir-channel:before{left:17px;right:17px;height:3px}.tr-hero-copy h1{color:#10242e}.con-selector{padding:4px}.con-model-wrap:after{opacity:.65}}
@media(prefers-reduced-motion:reduce){.studio-object *,[data-studio-part],.con-model-accent{animation:none!important;transition:none!important;transform:none!important;translate:none!important}.studio-parts-ready [data-studio-part]{opacity:1}.tr-section:before,.tr-section:after{transform:none!important}.dir-channel:hover,.cx-button:hover{transform:none!important}}
html[data-cx-motion-state=paused] [data-studio-part]{opacity:1;translate:0 0;transition:none!important}
html[data-studio-hidden=true] .studio-object *{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){.studio-ground,.studio-structure{transition:none!important;translate:none!important;opacity:1!important}}
