.commerce-page{--commerce-ink:#253020;--commerce-muted:#65715c;--commerce-line:#dce3d3;--commerce-lime:#d5f46a;background:#f7f8f2;color:var(--commerce-ink);font-family:Manrope,Arial,sans-serif;overflow:clip}
.commerce-page h1,.commerce-page h2,.commerce-page h3{font-family:inherit}
.commerce-breadcrumb{display:flex;flex-wrap:wrap;gap:12px;align-items:center;font-size:12px;color:#768269;padding:22px 0}
.commerce-breadcrumb a:hover{color:#2e4920}.commerce-breadcrumb>span:last-child{color:#394b2e}
.commerce-kicker{display:block;font-size:11px;line-height:1.6;letter-spacing:.13em;font-weight:650;color:#778668}
.commerce-hero{position:relative;min-height:510px;display:grid;grid-template-columns:.9fr 1.4fr;gap:35px;align-items:center;padding:60px 48px;border-radius:22px;background:#202e21;color:#f3f5e8;isolation:isolate;overflow:hidden}
.commerce-hero:before{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#202e21 12%,transparent 90%),repeating-linear-gradient(90deg,transparent 0,transparent 78px,#d5f46a09 79px,#d5f46a09 80px);z-index:-1}
.commerce-hero:after{content:'';position:absolute;width:490px;height:490px;border:1px solid #d5f46a29;border-radius:50%;right:-160px;top:-240px;box-shadow:0 0 0 55px #d5f46a04,0 0 0 56px #d5f46a13,0 0 0 110px #d5f46a03,0 0 0 111px #d5f46a09;z-index:-1}
.commerce-hero .commerce-kicker{color:#bdcf9c;font-size:10px}.commerce-hero-copy>p{font-size:clamp(35px,3.8vw,64px);line-height:1.09;font-weight:600;letter-spacing:-.055em;margin:26px 0 32px;max-width:450px}
.commerce-hero-tags{display:flex;flex-wrap:wrap;gap:8px}.commerce-hero-tags>span{font-size:11px;color:#d4dec7;border:1px solid #a3b38c44;border-radius:30px;padding:5px 12px}
.commerce-devices{position:relative;min-width:0;padding:20px 35px 30px 0}
.commerce-desktop{border:7px solid #3c463b;border-bottom-width:12px;border-radius:15px;background:#faf6ef;box-shadow:0 30px 60px #0005;position:relative}
.commerce-browser{height:25px;display:flex;align-items:center;gap:4px;padding:0 10px;color:#a5a394;font-size:6px;border-bottom:1px solid #dedbce;background:#f5f3ea;border-radius:7px 7px 0 0}
.commerce-browser i{width:4px;height:4px;border-radius:50%;background:#c5c4b9}.commerce-browser span{margin:auto}.commerce-desktop>img{width:100%;height:auto;aspect-ratio:1.84;object-fit:cover}
.commerce-sanayide .commerce-desktop>img{aspect-ratio:1905/909;object-fit:contain;background:#07131a}
.commerce-desktop-foot{width:50%;height:13px;margin:auto;background:linear-gradient(90deg,#88917c,#a7b09d,#758068);border-radius:0 0 5px 5px;position:relative}
.commerce-desktop-foot:after{content:'';position:absolute;top:13px;left:-10%;width:120%;height:5px;border-radius:10px;background:#8e9884}
.commerce-phone{position:absolute;right:-6px;bottom:0;width:28%;padding:22px 10px 12px;border:5px solid #424b3d;border-radius:22px;background:#faf5ec;color:#543e30;box-shadow:0 15px 35px #0004;display:flex;flex-direction:column;gap:8px}
.commerce-phone-notch{position:absolute;top:4px;width:35%;height:6px;border-radius:8px;background:#293026;left:32.5%}
.commerce-phone>strong{font-size:17px;line-height:1}.commerce-phone>span:not(.commerce-demo-button){font-size:6px;line-height:1.6}.commerce-phone>b{font-size:7px;font-weight:650}.commerce-phone>small{font-size:5px;line-height:1.5}
.commerce-vase{height:96px;display:grid;place-items:center;background:#e8d9c3;border-radius:9px;position:relative;overflow:hidden}
.commerce-vase i{display:block;position:relative;width:54px;height:55px;background:linear-gradient(90deg,#a75135,#dc9872,#a95135);border-radius:40% 40% 44% 44%;margin-top:17px;box-shadow:0 6px 8px #70422a23}
.commerce-vase i:before{content:'';position:absolute;bottom:43px;left:17px;width:20px;height:28px;background:linear-gradient(90deg,#ac583b,#d18b67);border-radius:3px 3px 0 0}
.commerce-demo-button{padding:7px 3px;border-radius:15px;background:#49392b;color:#fff6eb;font-size:6px;text-align:center}
.commerce-order{position:absolute;top:-4px;right:10%;display:flex;align-items:center;gap:10px;padding:12px 17px;border:1px solid #e8f3d0;border-radius:12px;background:#f3f9e9;color:#293725;box-shadow:0 12px 25px #0002;animation:commerce-float 6s ease-in-out infinite}
.commerce-order>span{display:grid;place-items:center;width:27px;height:27px;background:#d5f46a;border-radius:50%;font-size:14px}.commerce-order strong{display:block;font-size:11px}.commerce-order small{display:block;font-size:8px;margin-top:2px;color:#738067}
.commerce-concept-note{position:absolute;bottom:22px;right:30px;font-size:8px;letter-spacing:.14em;color:#9cab8c}
.commerce-custom-hero{width:100%;height:auto;aspect-ratio:2.1;object-fit:cover;grid-column:1/-1}.commerce-hero:has(.commerce-custom-hero){padding:0;min-height:0;background:transparent}
.commerce-intro{display:grid;grid-template-columns:1fr 1.25fr;gap:9%;padding:65px 0 45px}.commerce-intro h1{font-size:clamp(36px,3.9vw,60px);font-weight:650;letter-spacing:-.06em;line-height:1.13;margin:20px 0 0;max-width:440px}.commerce-intro p{font-size:15px;line-height:1.9;color:var(--commerce-muted);margin:0 0 20px}.commerce-intro .commerce-lead{font-size:19px;color:#3d4b34;line-height:1.7}
.commerce-link{display:inline-flex;align-items:center;gap:30px;padding:7px 0 10px;border-bottom:1px solid #a4b490;font-size:14px;font-weight:650;color:#3a4c2d}.commerce-link>span{font-size:24px;line-height:1;transition:transform .3s}.commerce-link:hover>span{transform:translate(4px,-4px)}
.commerce-brands{display:flex;align-items:center;gap:40px;padding:32px 0;border-top:1px solid var(--commerce-line);border-bottom:1px solid var(--commerce-line)}.commerce-brands>span{flex:0 0 160px;font-size:12px;line-height:1.8;color:#7f8b72}.commerce-brands>div{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));align-items:center;gap:28px;flex:1;min-width:0}.commerce-brands img{width:100%;height:36px;object-fit:contain;filter:grayscale(1);opacity:.65;transition:filter .3s,opacity .3s}.commerce-brands img:hover{filter:none;opacity:1}
.commerce-section{padding:95px 0}.commerce-section-head{display:flex;justify-content:space-between;align-items:flex-end;gap:55px;margin-bottom:48px}.commerce-section-head h2{font-size:clamp(32px,3.3vw,50px);font-weight:600;line-height:1.15;letter-spacing:-.05em;margin:20px 0 0;max-width:650px}.commerce-section-head>p{max-width:390px;font-size:15px;line-height:1.9;color:var(--commerce-muted);margin:0}.commerce-section-head>a{flex-shrink:0}
.commerce-features{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 50px}.commerce-feature{border-top:1px solid var(--commerce-line);padding:32px 0 20px}.commerce-feature svg{width:39px;height:39px;color:#667e47;margin-bottom:25px}.commerce-feature h3{font-size:20px;font-weight:650;letter-spacing:-.03em;line-height:1.4;margin:0 0 13px}.commerce-feature p{font-size:14px;line-height:1.85;color:var(--commerce-muted);max-width:330px;margin:0 0 18px}
.commerce-solutions{background:#e9eedf}.commerce-solution-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.commerce-solution-grid article{position:relative;padding:27px 24px 30px;border:1px solid #d8e0cd;border-radius:14px;background:#f7f9f0;transition:background .35s,box-shadow .35s}.commerce-solution-grid article:hover{background:#fff;box-shadow:0 16px 30px #25302008}.commerce-solution-mark{display:block;font-size:clamp(28px,3.4vw,53px);font-weight:550;letter-spacing:-.07em;color:#9aae7a;padding:13px 0 46px}.commerce-solution-number{position:absolute;right:22px;top:23px;font-size:10px;color:#869775}.commerce-solution-grid h3{font-size:19px;line-height:1.35;font-weight:650;letter-spacing:-.035em;margin:0 0 16px}.commerce-solution-grid p{font-size:14px;line-height:1.85;color:var(--commerce-muted);margin:0}
.commerce-story{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:9%;padding:35px 0 55px}.commerce-story-reverse{grid-template-columns:1fr 1.1fr}.commerce-story-reverse .commerce-story-art{order:2}.commerce-story-art{position:relative;min-width:0;min-height:355px;border-radius:18px;overflow:hidden;display:grid;align-items:center}.commerce-art-1{background:#eac4b1}.commerce-art-1>img{width:100%;height:auto}.commerce-art-2{background:#e3eacf}.commerce-art-3{background:#263628}.commerce-art-caption{position:absolute;bottom:20px;left:26px;font-size:8px;letter-spacing:.13em;color:#745d4f}.commerce-art-2 .commerce-art-caption{color:#6f8154}.commerce-art-3 .commerce-art-caption{color:#b0c79c}
.commerce-story-index{font-size:12px;letter-spacing:.05em;color:#8e9c7c}.commerce-story h3{font-size:clamp(28px,3vw,42px);line-height:1.18;letter-spacing:-.045em;font-weight:600;max-width:410px;margin:22px 0}.commerce-story-copy>p{font-size:15px;line-height:1.95;color:var(--commerce-muted);margin:0 0 24px}
.commerce-flow{max-width:340px;width:85%;margin:25px auto 50px;display:flex;align-items:center;flex-direction:column}.commerce-flow-node{padding:10px 28px;border:1px solid #a6b78e;border-radius:9px;font-size:12px;background:#f5f8ed}.commerce-flow-line{display:block;height:26px;width:1px;background:#98ac7b}.commerce-flow>strong{display:flex;flex-direction:column;align-items:center;justify-content:center;width:158px;height:88px;border-radius:12px;background:#2c4027;color:#e4f1cc;font-size:28px;line-height:1.2;letter-spacing:-.06em;box-shadow:0 12px 25px #273f2722}.commerce-flow>strong>span{font-size:9px;font-weight:400;letter-spacing:.025em;margin-top:9px}.commerce-flow-branches{display:flex;gap:15px;width:100%;justify-content:center;padding-top:30px;position:relative}.commerce-flow-branches:before{content:'';position:absolute;top:0;left:50%;height:30px;background:#98ac7b;width:1px}.commerce-flow-branches>span{flex:1;text-align:center;background:#f5f8ed;border:1px solid #bdcbaa;border-radius:7px;padding:12px 8px;font-size:11px;z-index:1}
.commerce-checklist{margin:32px auto 57px;width:76%;color:#edf4e2}.commerce-checklist>div{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:22px}.commerce-checklist>div>span{font-size:8px;letter-spacing:.1em;color:#a8bc93}.commerce-checklist b{font-size:24px;line-height:1.2;letter-spacing:-.045em;font-weight:500}.commerce-checklist p{display:flex;gap:14px;align-items:center;border-top:1px solid #9db38730;padding:11px 0;margin:0;font-size:12px;color:#c3d0b6}.commerce-checklist p>span{width:22px;height:22px;border:1px solid #7d9564;border-radius:50%;display:grid;place-items:center;color:#d5f46a;font-size:11px}
.commerce-process{background:#202d20;color:#f2f6e8}.commerce-process .commerce-kicker{color:#a7bc8c}
.commerce-roadmap{list-style:none;margin:0;padding:0;border-top:1px solid #c2d1ad35}
.commerce-roadmap li{display:grid;grid-template-columns:62px minmax(150px,1fr) minmax(210px,1.5fr) minmax(170px,1fr);align-items:center;gap:30px;position:relative;padding:32px 20px 32px 0;border-bottom:1px solid #c2d1ad35;transition:background .35s}
.commerce-roadmap li:hover{background:#ffffff04}
.roadmap-number{display:grid;place-items:center;width:52px;height:52px;border:1px solid #a6bf704d;border-radius:50%;font-size:18px;font-weight:500;letter-spacing:-.04em;color:#d5f46a;position:relative;background:#202d20}
.commerce-roadmap li:not(:last-child) .roadmap-number:after{content:'';position:absolute;width:1px;height:calc(100% + 17px);top:100%;left:50%;background:linear-gradient(#a6bf7050,transparent)}
.commerce-roadmap h3{font-size:clamp(21px,2vw,29px);font-weight:550;line-height:1.3;letter-spacing:-.035em;margin:0}
.commerce-roadmap p{font-size:15px;line-height:1.85;color:#bdc9b4;margin:0;max-width:43ch}
.roadmap-result{border-left:1px solid #b0c49535;padding-left:25px;display:flex;flex-direction:column;gap:10px}
.roadmap-result>span{font-size:9px;line-height:1.5;letter-spacing:.09em;color:#91a681}
.roadmap-result strong{font-size:15px;font-weight:500;line-height:1.6;color:#e3efce}
@media(max-width:1050px){.commerce-roadmap li{grid-template-columns:52px 1fr 1.5fr;gap:18px 24px;padding:28px 0}.roadmap-result{grid-column:3;padding:0;border:0;gap:5px}.roadmap-number{grid-row:span 2}.commerce-roadmap h3{align-self:start;grid-row:span 2}.commerce-roadmap li:not(:last-child) .roadmap-number:after{display:none}}
@media(max-width:650px){.commerce-roadmap li{grid-template-columns:42px minmax(0,1fr);gap:15px 18px;padding:25px 0}.roadmap-number{width:40px;height:40px;font-size:15px;grid-row:1;align-self:start}.commerce-roadmap h3{grid-row:1;align-self:center;font-size:25px}.commerce-roadmap p,.roadmap-result{grid-column:2}.roadmap-result{padding-top:16px;border-top:1px solid #c2d1ad25}.commerce-roadmap p{font-size:15px}.roadmap-result strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){.commerce-roadmap li{transition:none}}
.commerce-button{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;border-radius:50px;padding:10px 10px 10px 25px;background:#d5f46a;color:#24321b;font-size:14px;font-weight:650;transition:background .3s}.commerce-button>span{display:grid;place-items:center;width:38px;height:38px;border-radius:50%;background:#283a20;color:#e1f5aa;font-size:25px;transition:transform .3s}.commerce-button:hover{background:#cbea59}.commerce-button:hover>span{transform:rotate(45deg)}
.commerce-project{padding-bottom:30px}.commerce-project-card{display:block;position:relative;border-radius:18px;overflow:hidden;background:#ead4c4}.commerce-project-card>img{width:100%;height:auto;max-height:570px;object-fit:cover;object-position:center top;transform-origin:center top;transition:transform .7s}.commerce-project-card:hover>img{transform:scale(1.02)}.commerce-project-card>div{position:relative;background:#efe4d9;padding:27px 35px;display:flex;flex-direction:column;gap:8px}.commerce-project-card>div>span:first-child{font-size:10px;letter-spacing:.12em;color:#927963}.commerce-project-card h3{font-size:26px;letter-spacing:-.04em;font-weight:600;margin:0;padding-right:55px}.commerce-project-arrow{position:absolute;right:30px;top:32px;width:42px;height:42px;border:1px solid #bca18b;border-radius:50%;display:grid;place-items:center;font-size:25px}
.commerce-articles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px}.commerce-articles>a{position:relative;display:flex;flex-direction:column;border-top:1px solid #bfcbb1;padding:25px 0 0}.commerce-articles>a>span:first-child{font-size:11px;color:#7c8b6e}.commerce-article-glyph{height:145px;display:flex;align-items:center;font-size:90px;font-weight:500;letter-spacing:-.07em;color:#96a97c}.commerce-articles h3{font-size:23px;line-height:1.35;letter-spacing:-.04em;font-weight:600;margin:5px 0 16px}.commerce-articles p{font-size:14px;line-height:1.85;color:var(--commerce-muted);margin:0 0 25px}.commerce-articles b{display:flex;justify-content:space-between;align-items:center;margin-top:auto;padding:15px 0;border-bottom:1px solid #d7dfce;font-size:12px;font-weight:600}.commerce-articles b>span{font-size:22px}.commerce-articles a:hover h3{color:#6a843f}
.commerce-questions .questions-intro>p{font-size:15px}.commerce-questions .question-item h3{font-size:16px}.commerce-questions .question-answer{font-size:14px}
.commerce-closing{padding:85px 0 95px;background:#e3ebd3;text-align:center}.commerce-closing h2{font-size:clamp(34px,4.3vw,62px);font-weight:600;line-height:1.13;letter-spacing:-.055em;margin:25px auto;max-width:800px}.commerce-closing p{font-size:16px;line-height:1.8;color:#6c7d5c;max-width:510px;margin:0 auto 30px}.commerce-closing .commerce-button{background:#263a21;color:#f0f6e7}.commerce-closing .commerce-button>span{background:#d5f46a;color:#25361c}
.commerce-page a:focus-visible{outline:2px solid #829f43;outline-offset:5px}
@keyframes commerce-float{50%{transform:translateY(-7px)}}
@media(max-width:1100px){.commerce-hero{padding:45px 30px;min-height:430px;gap:22px}.commerce-hero-copy>p{font-size:40px}.commerce-intro{gap:6%}.commerce-brands{gap:25px}.commerce-brands>div{gap:20px}.commerce-brands>span{flex-basis:140px}.commerce-section-head{gap:35px}.commerce-section-head>p{max-width:330px}.commerce-solution-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.commerce-solution-mark{padding-bottom:30px}.commerce-story{gap:6%}.commerce-story-art{min-height:320px}.commerce-checklist>div{flex-direction:column;gap:12px}.commerce-steps{gap:23px}.commerce-steps h3{font-size:18px}}
@media(max-width:760px){.commerce-breadcrumb{padding:17px 0;font-size:11px;gap:9px}.commerce-hero{grid-template-columns:1fr;padding:35px 25px 48px;gap:30px;border-radius:15px;min-height:0}.commerce-hero-copy>p{font-size:clamp(36px,7vw,52px);max-width:none;margin:19px 0 24px}.commerce-devices{width:100%;max-width:510px;margin:auto;padding:20px 30px 22px 0}.commerce-phone{max-width:140px;width:27%;border-width:4px;border-radius:15px;padding:18px 8px 10px;gap:6px}.commerce-phone>strong{font-size:14px}.commerce-vase{height:75px}.commerce-vase i{transform:scale(.8)}.commerce-order{padding:9px 12px;right:5%;gap:8px}.commerce-order strong{font-size:9px}.commerce-order small{font-size:7px}.commerce-order>span{width:23px;height:23px;font-size:12px}.commerce-concept-note{font-size:7px;bottom:17px;right:20px}.commerce-intro{grid-template-columns:1fr;gap:28px;padding:40px 0}.commerce-intro h1{font-size:39px;max-width:500px;margin-top:15px}.commerce-intro .commerce-lead{font-size:18px}.commerce-intro p{font-size:15px}.commerce-brands{flex-direction:column;align-items:stretch;gap:25px;padding:27px 0}.commerce-brands>span{flex-basis:auto}.commerce-brands>span br{display:none}.commerce-brands>div{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 28px}.commerce-brands img{height:32px}.commerce-section{padding:60px 0}.commerce-section-head{flex-direction:column;align-items:flex-start;gap:22px;margin-bottom:35px}.commerce-section-head h2{font-size:36px}.commerce-section-head>p{max-width:none;font-size:15px}.commerce-features{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px}.commerce-feature{padding-top:25px}.commerce-feature h3{font-size:18px}.commerce-feature svg{width:34px;height:34px;margin-bottom:20px}.commerce-solution-grid article{padding:23px 20px}.commerce-solution-mark{font-size:36px}.commerce-story,.commerce-story-reverse{grid-template-columns:1fr;gap:28px;padding:0 0 50px}.commerce-story-reverse .commerce-story-art{order:0}.commerce-story-art{min-height:310px}.commerce-story h3{font-size:31px;max-width:500px;margin:17px 0}.commerce-story-copy>p{font-size:15px}.commerce-art-1{min-height:270px}.commerce-checklist>div{flex-direction:row}.commerce-checklist b{font-size:25px}.commerce-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 24px}.commerce-steps h3{font-size:20px}.commerce-project-card>div{padding:23px}.commerce-project-card h3{font-size:22px}.commerce-project-card>div>span:first-child{font-size:8px}.commerce-project-arrow{right:20px;width:35px;height:35px;top:36px}.commerce-articles{grid-template-columns:1fr;gap:35px}.commerce-articles>a{padding-top:22px}.commerce-article-glyph{position:absolute;right:10px;top:3px;font-size:55px;height:60px;opacity:.45}.commerce-articles h3{max-width:90%;margin-top:28px}.commerce-questions .question-item h3{font-size:15px}.commerce-closing{padding:60px 0}.commerce-closing h2{font-size:38px}}
@media(max-width:430px){.commerce-hero-copy>p{font-size:36px}.commerce-hero{padding:28px 19px 42px}.commerce-hero-tags{gap:5px}.commerce-hero-tags>span{font-size:10px;padding:5px 10px}.commerce-phone{width:30%}.commerce-browser{height:18px}.commerce-order{top:-8px;right:2%;padding:8px}.commerce-vase{height:55px}.commerce-vase i{transform:scale(.6);margin-top:5px}.commerce-phone>small{display:none}.commerce-desktop{border-width:5px}.commerce-hero .commerce-kicker{font-size:9px}.commerce-features{grid-template-columns:1fr}.commerce-feature{display:grid;grid-template-columns:40px 1fr;column-gap:20px;padding:25px 0}.commerce-feature svg{grid-row:span 2;margin:0}.commerce-feature h3{margin:0 0 10px}.commerce-feature p{margin:0}.commerce-solution-grid{grid-template-columns:1fr}.commerce-solution-mark{padding:0 0 25px;font-size:45px}.commerce-section-head h2{font-size:32px}.commerce-steps{grid-template-columns:1fr}.commerce-steps li{display:grid;grid-template-columns:42px 1fr;gap:0 20px}.commerce-steps li>span{grid-row:span 2;font-size:34px}.commerce-steps h3{margin:0 0 14px}.commerce-story-art{min-height:300px}.commerce-art-1{min-height:240px}.commerce-checklist{width:82%}.commerce-intro h1{font-size:37px}.commerce-kicker{font-size:10px}}
@media(prefers-reduced-motion:reduce){.commerce-order{animation:none}.commerce-page a,.commerce-page img,.commerce-button>span,.commerce-link>span,.commerce-solution-grid article{transition:none}.commerce-project-card:hover>img{transform:none}}

/* Supplied Sanayide Ne Var screenshots retain their original proportions. */
.commerce-sanayide .commerce-phone-screen{padding:14px 0 0;gap:0;overflow:hidden;background:#08151c}
.commerce-phone-screen>img{display:block;width:100%;height:auto;aspect-ratio:399/832;object-fit:contain}
.commerce-phone-screen .commerce-phone-notch{background:#708077;height:4px;top:4px}

/* Service introduction first, with a compact live-project mockup beside it. */
.commerce-first-row{display:grid;grid-template-columns:1fr 1.08fr;gap:6%;align-items:center;padding:22px 0 52px}
.commerce-first-copy h1{font-size:clamp(42px,4.8vw,72px);font-weight:800;letter-spacing:-.06em;line-height:1.08;margin:21px 0 26px;max-width:530px}
.commerce-first-copy p{font-size:15px;line-height:1.9;color:var(--commerce-muted);margin:0 0 20px;max-width:580px}
.commerce-first-copy .commerce-lead{font-size:18px;line-height:1.8;color:#43523a}
.commerce-first-copy .commerce-button{margin-top:9px}
.commerce-hero.commerce-hero-showcase{grid-template-columns:1fr;gap:0;padding:58px 28px 48px;min-height:420px;align-self:stretch;align-content:center}
.commerce-hero-showcase .commerce-devices{width:100%;margin:auto;max-width:650px;padding:24px 30px 25px 0}
.commerce-hero-showcase .commerce-order{top:-7px;right:4%;padding:10px 12px}
.commerce-hero-showcase .commerce-concept-note{right:23px;font-size:8px}
.commerce-hero-showcase:has(.commerce-custom-hero){padding:0;min-height:0}.commerce-hero-showcase .commerce-custom-hero{aspect-ratio:1;object-fit:contain}
.commerce-site-gallery{padding:38px 0 45px;border-top:1px solid var(--commerce-line)}
.commerce-gallery-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:30px}
.commerce-gallery-heading h2{font-size:clamp(29px,3vw,42px);font-weight:600;letter-spacing:-.05em;line-height:1.15;margin:13px 0 0}
.commerce-sites-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 26px)/2);gap:26px;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;scrollbar-width:none;padding:5px 0 10px}
.commerce-sites-track::-webkit-scrollbar{display:none}.commerce-site-card{min-width:0;scroll-snap-align:start;scroll-snap-stop:always}
.commerce-site-screen{border-radius:12px;overflow:hidden;border:1px solid #d8dfcf;background:#e6ebdf}
.commerce-site-bar{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:11px 15px;font-size:9px;color:#88967b;background:#edf1e6}
.commerce-site-bar>span:first-child{letter-spacing:3px;font-size:7px}.commerce-site-bar>span:nth-child(2){overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.commerce-site-screen img{width:100%;height:auto;aspect-ratio:1.9;object-fit:cover;object-position:top;transition:transform .6s}
.commerce-site-card a:hover img{transform:scale(1.025)}
.commerce-site-caption{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:22px 0 10px}
.commerce-site-caption>div>span{font-size:10px;letter-spacing:.09em;color:#7b8a6c}.commerce-site-caption h3{font-size:22px;font-weight:600;line-height:1.35;letter-spacing:-.04em;margin:8px 0 0}
.commerce-site-caption>span{display:grid;place-items:center;width:36px;height:36px;flex:0 0 36px;border:1px solid #b9c6a9;border-radius:50%;font-size:23px}
.commerce-sites-track:focus-visible{outline:2px solid #829f43;outline-offset:4px;border-radius:10px}
.commerce-site-gallery .voices-controls{margin-top:14px;padding-bottom:0;border-bottom:0}
@media(max-width:1000px){.commerce-first-row{gap:4%;grid-template-columns:1fr 1fr}.commerce-first-copy h1{font-size:48px}.commerce-first-copy .commerce-lead{font-size:16px}.commerce-first-copy p{font-size:14px}.commerce-hero.commerce-hero-showcase{padding:45px 20px;min-height:340px}.commerce-hero-showcase .commerce-order small{font-size:7px}.commerce-hero-showcase .commerce-order strong{font-size:9px}}
@media(max-width:760px){.commerce-first-row{grid-template-columns:1fr;gap:32px;padding:20px 0 38px}.commerce-first-copy h1{font-size:48px;max-width:500px}.commerce-first-copy .commerce-lead{font-size:18px}.commerce-first-copy p{font-size:15px}.commerce-hero.commerce-hero-showcase{min-height:310px;padding:45px 25px 48px}.commerce-sites-track{grid-auto-columns:88%;gap:18px}.commerce-gallery-heading{align-items:flex-start;flex-direction:column;gap:18px}.commerce-gallery-heading h2{font-size:33px}.commerce-site-gallery{padding:32px 0}.commerce-site-caption h3{font-size:21px}}
@media(max-width:430px){.commerce-first-copy h1{font-size:43px}.commerce-hero.commerce-hero-showcase{min-height:280px;padding:40px 18px 42px}.commerce-hero-showcase .commerce-concept-note{font-size:7px}.commerce-site-bar{font-size:8px;padding:9px 12px}}
@media(prefers-reduced-motion:reduce){.commerce-sites-track{scroll-snap-type:none}.commerce-site-screen img{transition:none}.commerce-site-card a:hover img{transform:none}}
/* Hardware presentation on the same open orbital backdrop as the about section. */
.commerce-hero.commerce-hero-showcase{background:transparent;border-radius:0;overflow:visible;min-height:460px;padding:50px 0 65px;color:#526543}
.commerce-hero-showcase:before{inset:12% 0 7%;background:radial-gradient(ellipse at 50% 55%,#dce7c957,transparent 67%);border-radius:50%}
.commerce-hero-showcase:after{width:82%;height:1px;left:9%;right:auto;top:auto;bottom:29px;background:linear-gradient(90deg,transparent,#b9c4ad,transparent);border:0;border-radius:0;box-shadow:none}
.commerce-device-orbits{position:absolute;width:105%;max-width:none;height:auto;left:-2.5%;top:50%;transform:translateY(-52%);z-index:-1;pointer-events:none}
.commerce-device-orbit-spin{transform-origin:260px 260px;animation:commerce-device-orbit 42s linear infinite}.commerce-device-orbit-reverse{animation-duration:56s;animation-direction:reverse}
.commerce-real-devices{position:relative;width:100%;padding:22px 11% 55px 1%;isolation:isolate}
.commerce-real-devices:after{content:'';position:absolute;left:7%;right:-2%;height:25px;bottom:14px;background:radial-gradient(ellipse,#34412b30,transparent 68%);filter:blur(7px);z-index:-1}
.commerce-monitor{position:relative;border:1px solid #969b99;border-radius:13px 13px 10px 10px;background:#c3c6c6;box-shadow:0 2px 1px #fff inset,0 14px 27px #23311d17,0 3px 5px #25302013}
.commerce-monitor-screen{position:relative;padding:13px 8px 8px;border:2px solid #505653;border-bottom:0;background:linear-gradient(120deg,#282d2c,#0a1010 45%,#292f2c);border-radius:12px 12px 0 0;overflow:hidden}
.commerce-monitor-viewport{position:relative;aspect-ratio:1905/909;overflow:hidden;border:1px solid #141d1b;border-radius:2px;background:#07141b}
.commerce-monitor-viewport>img{display:block;width:100%;height:auto;max-width:none;will-change:transform;transform-origin:center top;animation:commerce-screen-scroll 30s ease-in-out infinite alternate}
.commerce-monitor-camera{position:absolute;left:calc(50% - 2px);top:5px;width:4px;height:4px;border-radius:50%;background:#1c2c31;box-shadow:0 0 0 1px #080d0d,inset 1px 0 1px #435d67}
.commerce-monitor-chin{height:29px;display:grid;place-items:center;background:linear-gradient(105deg,#afb4b1,#e5e7e5 36%,#c6cbc8 70%,#a5aca8);border-top:1px solid #808883;border-radius:0 0 9px 9px;box-shadow:0 -1px 0 #f8faf7 inset}
.commerce-monitor-chin>span{width:5px;height:5px;border-radius:50%;background:#a0a8a1;box-shadow:0 1px 1px #f4f5f2}
.commerce-monitor-neck{position:absolute;width:17%;height:49px;left:41.5%;top:100%;background:linear-gradient(90deg,#a7aeaa,#d4d9d4 35%,#edf0ec 48%,#b5bcb6 94%);clip-path:polygon(16% 0,84% 0,100% 100%,0 100%);z-index:-1;box-shadow:inset 0 8px 12px #666f6955}
.commerce-monitor-base{position:absolute;top:calc(100% + 43px);width:36%;height:10px;left:32%;background:linear-gradient(#e8ece7 0%,#b7c0b6 45%,#859081 65%,#c8d0c2 100%);border-radius:50% 50% 4px 4px;box-shadow:0 4px 5px #25311c22}
.commerce-handset{position:absolute;right:0;bottom:15px;width:26%;max-width:168px;padding:4px;border:1px solid #7d8787;border-radius:clamp(16px,2.3vw,30px);background:linear-gradient(110deg,#b7bdbb,#4d5655 10%,#bdc3bf 45%,#545e59 90%,#d4d8d2);box-shadow:inset 0 0 0 1px #e5e9e288,5px 13px 22px #22301a2e,-2px 3px 5px #1c2c1b23}
.commerce-handset-screen{position:relative;overflow:hidden;border:3px solid #111a1c;border-radius:clamp(12px,1.9vw,25px);background:#08151c}
.commerce-handset-viewport{position:relative;aspect-ratio:352/620;overflow:hidden;background:#08151c}
.commerce-handset-viewport>img{display:block;width:100%;height:auto;max-width:none;will-change:transform;transform-origin:center top;animation:commerce-phone-scroll 26s ease-in-out -2.8s infinite alternate}
.commerce-handset-status{height:23px;display:flex;align-items:center;justify-content:space-between;padding:0 8px;color:#e0e6e7;font-size:5px;background:#08141c;position:relative}
.commerce-handset-status i{position:absolute;left:34%;top:5px;width:32%;height:10px;border-radius:15px;background:#010405;box-shadow:0 0 0 1px #182225}
.commerce-handset-status i:after{content:'';position:absolute;right:4px;top:3px;width:3px;height:3px;border-radius:50%;background:#263d48}
.commerce-handset-home{height:12px;position:relative;background:#08151c}.commerce-handset-home:after{content:'';position:absolute;left:30%;width:40%;top:5px;height:2px;background:#d3dddf;border-radius:4px}
.commerce-handset-key{position:absolute;background:linear-gradient(90deg,#646f6b,#c6cec5);width:2px;border-radius:1px}.commerce-handset-key-left{height:25px;left:-2px;top:52px}.commerce-handset-key-right{height:31px;right:-2px;top:66px}
.commerce-device-caption{position:absolute;bottom:7px;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:13px;font-size:8px;letter-spacing:.13em;font-weight:550;color:#839177}.commerce-device-caption i{width:3px;height:3px;border-radius:50%;background:#8fa463}
@keyframes commerce-device-orbit{to{transform:rotate(360deg)}}
/* The supplied full-page captures drift inside the frames so the mockup reads
   like a real site being explored, rather than a static poster. */
@keyframes commerce-screen-scroll{0%,12%{transform:scale(1.012) translateY(0)}84%,100%{transform:scale(1.012) translateY(-78.5%)}}
@keyframes commerce-phone-scroll{0%,12%{transform:scale(1.012) translateY(0)}84%,100%{transform:scale(1.012) translateY(-90.2%)}}
@media(max-width:1000px){.commerce-hero.commerce-hero-showcase{min-height:390px;padding:45px 0 65px}.commerce-monitor-chin{height:24px}.commerce-monitor-screen{padding:11px 6px 6px}.commerce-handset-status{height:18px;padding:0 5px}.commerce-handset-status i{height:8px;top:4px}.commerce-device-caption{font-size:7px;letter-spacing:.08em;gap:8px}}
@media(max-width:760px){.commerce-hero.commerce-hero-showcase{min-height:380px;padding:45px 8px 60px;max-width:600px;width:100%;margin:auto;align-self:center}.commerce-device-orbits{width:100%;left:0}.commerce-monitor-chin{height:28px}.commerce-handset{border-radius:25px}.commerce-handset-screen{border-radius:20px}.commerce-handset-status{height:22px}.commerce-handset-status i{height:10px;top:5px}}
@media(max-width:430px){.commerce-hero.commerce-hero-showcase{min-height:320px;padding:38px 0 60px}.commerce-monitor-screen{padding:10px 5px 5px;border-width:1px}.commerce-monitor-camera{top:4px;width:3px;height:3px}.commerce-monitor-chin{height:20px}.commerce-monitor-neck{height:38px}.commerce-monitor-base{top:calc(100% + 33px);height:8px}.commerce-real-devices{padding-bottom:45px}.commerce-handset{padding:3px;width:27%;border-radius:18px}.commerce-handset-screen{border-width:2px;border-radius:14px}.commerce-handset-status{height:15px;font-size:4px}.commerce-handset-status i{height:7px;top:3px}.commerce-handset-home{height:8px}.commerce-handset-home:after{top:3px}.commerce-device-caption{font-size:6px;gap:9px}.commerce-device-orbits{width:105%;left:-2.5%}}
@media(prefers-reduced-motion:reduce){.commerce-device-orbit-spin,.commerce-monitor-viewport>img,.commerce-handset-viewport>img{animation:none;transform:none}}

/* A quieter, two-lane reference ribbon matching the homepage treatment. */
.commerce-brand-ribbon{padding:40px 0 24px;width:100%;margin:0}
.commerce-foundation{background:#f3f4ef}
.foundation-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.foundation-card{display:flex;flex-direction:column;min-width:0;padding:32px;background:#fafbf7;border:1px solid #dce1d5;border-radius:18px;transition:border-color .3s,box-shadow .3s}
.foundation-card:hover{border-color:#a7b493;box-shadow:0 12px 35px #25302008}
.foundation-card-top{display:flex;align-items:center;gap:14px;margin-bottom:30px}
.foundation-card-top>span:last-child{font-size:11px;line-height:1.5;font-weight:650;letter-spacing:.08em;color:#647158}
.foundation-icon{display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;border-radius:14px;background:#eaf0dd;color:#405831}
.foundation-icon svg{width:27px;height:27px}
.foundation-card h3{font-size:clamp(23px,2vw,30px);font-weight:650;line-height:1.22;letter-spacing:-.045em;margin:0 0 16px}
.foundation-card>p{font-size:16px;line-height:1.8;color:#65715c;margin:0 0 30px;max-width:35ch}
.foundation-card ul{list-style:none;padding:21px 0 0;margin:auto 0 0;border-top:1px solid #dfe4d8;display:grid;gap:13px}
.foundation-card li{display:flex;align-items:baseline;gap:10px;font-size:14px;line-height:1.6;color:#3d4d32}
.foundation-card li>span{color:#6c853e;font-size:13px;flex:none}
@media(max-width:1050px) and (min-width:761px){.foundation-cards{gap:14px}.foundation-card{padding:24px 20px}.foundation-card-top{gap:10px}.foundation-card-top>span:last-child{font-size:10px}}
@media(max-width:760px){.foundation-cards{grid-template-columns:1fr;gap:16px}.foundation-card{padding:26px}.foundation-card-top{margin-bottom:22px}.foundation-card h3{font-size:28px}.foundation-card>p{max-width:none;margin-bottom:24px}}
@media(prefers-reduced-motion:reduce){.foundation-card{transition:none}}
.commerce-solutions{background:#eef0e8}
.commerce-models{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}
.commerce-model{display:grid;grid-template-columns:minmax(0,1fr) 138px;align-items:center;gap:24px 16px;padding:34px 32px 23px;border:1px solid #d8ddcf;border-radius:20px;background:#fcfcf8;position:relative;overflow:hidden;transition:border-color .4s,box-shadow .4s}
.commerce-model:nth-child(2),.commerce-model:nth-child(3){background:#f6f8ef}
.commerce-model:hover{border-color:#9aaa83;box-shadow:0 14px 35px #2b3e1808}
.commerce-model-copy{position:relative;z-index:1}
.commerce-model-label{display:flex;gap:8px;align-items:center;font-size:9px;letter-spacing:.07em;line-height:1.65;font-weight:650;color:#70805f;margin-bottom:20px}
.commerce-model-label i{flex:0 0 5px;width:5px;height:5px;border-radius:50%;background:#9bb765}
.commerce-model h3{font-size:clamp(24px,2.3vw,34px);line-height:1.15;font-weight:600;letter-spacing:-.045em;margin:0 0 15px;color:#263322}
.commerce-model p{font-size:15px;line-height:1.8;color:#63715a;margin:0;max-width:38ch}
.commerce-model-art{position:relative;width:138px;height:150px;display:grid;place-items:center;color:#61784d}
.commerce-model-art:before{content:'';position:absolute;width:120px;height:120px;border-radius:50%;background:#e7eddb;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.commerce-model-art svg{position:relative;width:100%;height:auto;transition:transform .7s cubic-bezier(.22,1,.36,1)}
.commerce-model:hover .commerce-model-art svg{transform:translateY(-5px)}
.commerce-model:hover .commerce-model-art:before{transform:scale(1.07)}
.commerce-model-art .model-fill{fill:#f8fbf1}.commerce-model-art .model-solid{fill:#6a8150;stroke:#6a8150}.commerce-model-art .model-check{stroke:#fff}
.commerce-model-tags{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:10px 22px;border-top:1px solid #dfe4d7;padding-top:19px;color:#536648;font-size:12px;line-height:1.5}
.commerce-model-tags span{display:flex;align-items:center;gap:8px}.commerce-model-tags span:before{content:'✓';color:#839e5e;font-size:11px}
@media(max-width:1100px){.commerce-model{padding:28px 25px 22px;grid-template-columns:minmax(0,1fr) 100px;gap:22px 10px}.commerce-model-art{width:100px;height:120px}.commerce-model-art:before{width:95px;height:95px}.commerce-model h3{font-size:26px}.commerce-model-label{font-size:8px}}
@media(max-width:760px){.commerce-models{grid-template-columns:1fr;gap:16px}.commerce-model{padding:27px 24px 22px;grid-template-columns:minmax(0,1fr) 100px}.commerce-model-label{font-size:9px}.commerce-model h3{font-size:29px}.commerce-model-art{width:100px}.commerce-model p{font-size:15px}}
@media(max-width:420px){.commerce-model{grid-template-columns:minmax(0,1fr) 66px;gap:20px 10px;padding:25px 21px 21px}.commerce-model-art{width:66px}.commerce-model-art:before{width:66px;height:66px}.commerce-model h3{font-size:27px}.commerce-model-label{font-size:8px;letter-spacing:.04em}.commerce-model-tags{gap:10px 16px}}
@media(prefers-reduced-motion:reduce){.commerce-model,.commerce-model-art svg,.commerce-model-art:before{transition:none}.commerce-model:hover .commerce-model-art svg,.commerce-model:hover .commerce-model-art:before{transform:none}}
.commerce-stories .commerce-story{padding-top:18px}
.commerce-stories .commerce-story + .commerce-story{margin-top:24px;padding-top:58px;border-top:1px solid var(--commerce-line)}
@media(max-width:760px){.commerce-solution-grid article{min-height:225px}.commerce-stories .commerce-story + .commerce-story{margin-top:10px;padding-top:36px}}
@media(prefers-reduced-motion:reduce){.commerce-brand-ribbon .ribbon-logo img,.commerce-foundation .commerce-feature{transition:none}.commerce-brand-ribbon .ribbon-logo:hover img,.commerce-foundation .commerce-feature:hover{transform:none}}

/* On narrow screens the project story becomes a touch-friendly, one-card gallery. */
@media(max-width:760px){
  .commerce-page .agency-projects{padding:42px 0 54px;margin-top:0}
  .commerce-page .project-deck-heading{gap:18px;margin-bottom:26px;padding-top:26px}
  .commerce-page .project-deck-heading h2{font-size:clamp(32px,8.5vw,40px);line-height:1.1;max-width:15ch}
  .commerce-page .project-deck-heading>a{font-size:12px;gap:12px;padding-bottom:7px}
  .commerce-page .project-deck{width:100%;max-width:none}
  .commerce-page .agency-projects.is-mobile-deck .project-deck-slides{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-x:contain;border-radius:14px}
  .commerce-page .agency-projects.is-mobile-deck .project-deck-slides::-webkit-scrollbar{display:none}
  .commerce-page .agency-projects.is-mobile-deck .project-deck-card{flex:0 0 100%;min-width:0;margin:0;scroll-snap-align:start;scroll-snap-stop:always}
  .commerce-page .agency-projects.is-mobile-deck .project-deck-sheets{display:none}
  .commerce-page .project-deck-caption{min-height:152px;align-content:start}
  .commerce-page .project-deck-caption p{line-height:1.5}
  .commerce-page .project-deck-controls{margin-top:18px;gap:20px}
  .commerce-page .project-deck-controls button{width:44px;height:44px}
  .commerce-page .project-deck-footnote{margin-top:22px}
}
@media(max-width:360px){
  .commerce-page .project-deck-heading h2{font-size:31px}
  .commerce-page .project-deck-art{aspect-ratio:1.25}
  .commerce-page .project-deck-caption{padding:17px 15px;min-height:162px}
  .commerce-page .project-deck-caption h3{font-size:21px}
}

/* Connected-systems hero: the service uses the same page rhythm with its own visual story. */
.integration-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:30px 0 60px}
.integration-page .commerce-hero-showcase:before{inset:6% -4%;background:radial-gradient(ellipse at center,#c6d6ac70,transparent 65%)}
.integration-page .commerce-hero-showcase:after{bottom:28px}
.integration-visual{position:relative;width:100%;max-width:760px;margin:auto;padding:18px 20px}
.integration-board{position:relative;overflow:hidden;padding:21px 25px 24px;border-radius:19px;background:#1c2b22;color:#f3f6ee;border:1px solid #41533d;box-shadow:0 35px 65px -37px #1a2e20a6,0 0 0 7px #ecf0e5}
.integration-board:before{content:'';position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 51% 40%,#d5f46a1b,transparent 42%),repeating-linear-gradient(90deg,transparent 0 76px,#c2ddaf0b 77px 78px)}
.integration-board-top,.integration-board-bottom{position:relative;display:flex;justify-content:space-between;align-items:center;gap:12px;font-size:9px;letter-spacing:.14em;font-weight:650;color:#aebfa8}
.integration-board-top{padding-bottom:17px;border-bottom:1px solid #d9edbd2c}.integration-board-top>span:first-child{display:flex;align-items:center;gap:9px}.integration-board-top i,.integration-pulse{display:inline-block;width:6px;height:6px;border-radius:50%;background:#d5f46a;box-shadow:0 0 12px #d5f46a}.integration-board-top b{font-size:14px;color:#d5f46a}
.integration-flow{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 48px minmax(0,1.25fr) 48px minmax(0,1fr);align-items:center;gap:8px;padding:44px 0 40px}
.integration-node{position:relative;min-width:0;min-height:146px;display:flex;flex-direction:column;align-items:flex-start;padding:20px 17px;border:1px solid #b6c6ae4a;border-radius:13px;background:#ffffff0a}
.integration-node-icon{font-size:27px;line-height:1;color:#d5f46a;margin-bottom:auto}.integration-node small{font-size:8px;letter-spacing:.16em;color:#a9bea0;margin:10px 0 4px}.integration-node strong{font-size:17px;line-height:1.2;letter-spacing:-.04em;white-space:nowrap}.integration-node em{font-style:normal;font-size:9px;color:#9fb394;margin-top:5px}
.integration-node-core{align-items:center;justify-content:center;text-align:center;border-color:#d5f46a83;background:#d5f46a0f;box-shadow:0 0 0 7px #d5f46a0a}.integration-core-mark{display:flex;align-items:center;gap:6px;font-size:36px;font-weight:800;letter-spacing:-.09em;line-height:1;color:#d5f46a}.integration-core-mark span{font-size:19px;font-weight:400}.integration-node-core small{margin:9px 0 7px}.integration-node-core strong{font-size:10px;font-weight:550;letter-spacing:0;white-space:normal}
.integration-connector{position:relative;height:2px;background:#d5f46a70}.integration-connector:before,.integration-connector:after{content:'';position:absolute;top:-2px;width:6px;height:6px;border-radius:50%;background:#d5f46a}.integration-connector:before{left:0}.integration-connector:after{right:0}.integration-connector i{position:absolute;left:0;top:-2px;width:6px;height:6px;background:#f6ffd8;border-radius:50%;box-shadow:0 0 12px #d5f46a;animation:integration-packet 3s ease-in-out infinite}.integration-connector:nth-of-type(4) i{animation-delay:1.5s}.integration-connector span{position:absolute;left:50%;bottom:11px;transform:translateX(-50%);white-space:nowrap;font-size:7px;letter-spacing:.1em;color:#a7bca1}
.integration-board-bottom{border-top:1px solid #d9edbd2c;padding-top:15px;letter-spacing:.05em}.integration-board-bottom>span:first-child{display:flex;align-items:center;gap:9px}.integration-board-bottom i{display:inline-block;width:18px;height:1px;margin:0 6px 3px;background:#8eaa7b}
@keyframes integration-packet{0%,12%{left:0;opacity:0}20%{opacity:1}80%{opacity:1}90%,100%{left:calc(100% - 6px);opacity:0}}
@media(max-width:1100px){.integration-page .commerce-hero.commerce-hero-showcase{min-height:400px}.integration-visual{padding-inline:4px}.integration-board{padding:17px}.integration-flow{grid-template-columns:minmax(0,1fr) 25px minmax(0,1.2fr) 25px minmax(0,1fr);gap:3px}.integration-node{padding:14px 10px;min-height:127px}.integration-node strong{font-size:13px}.integration-core-mark{font-size:29px}.integration-node-core strong{font-size:9px}}
@media(max-width:760px){.integration-page .commerce-hero.commerce-hero-showcase{min-height:340px;padding:22px 0 38px}.integration-visual{max-width:600px;padding:15px 4px}.integration-flow{padding:35px 0 33px}.integration-node{min-height:116px}.integration-board-top,.integration-board-bottom{font-size:8px}}
@media(max-width:430px){.integration-page .commerce-hero.commerce-hero-showcase{min-height:278px;padding:10px 0 30px}.integration-board{padding:12px 11px 15px;border-radius:13px;box-shadow:0 22px 45px -26px #1a2e20a6,0 0 0 4px #ecf0e5}.integration-board-top,.integration-board-bottom{font-size:6px;letter-spacing:.06em}.integration-board-top{padding-bottom:10px}.integration-flow{grid-template-columns:minmax(0,1fr) 12px minmax(0,1.2fr) 12px minmax(0,1fr);gap:2px;padding:26px 0 23px}.integration-node{padding:9px 6px;min-height:95px;border-radius:8px}.integration-node-icon{font-size:18px}.integration-node small{font-size:6px;letter-spacing:.05em;margin:7px 0 3px}.integration-node strong{font-size:10px;white-space:normal}.integration-node em{font-size:6px;margin-top:2px}.integration-core-mark{font-size:21px}.integration-core-mark span{font-size:11px}.integration-node-core small{font-size:5px}.integration-node-core strong{font-size:6px}.integration-connector span{display:none}.integration-board-bottom i{width:8px;margin-inline:2px}}
@media(prefers-reduced-motion:reduce){.integration-connector i{animation:none}}

/* CRM concept dashboard: a contained product preview, not a claim of a live product. */
.crm-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:480px;padding:30px 0 55px}
.crm-page .commerce-hero-showcase:before{inset:4% -3%;background:radial-gradient(ellipse at 50% 54%,#cbd9ba82,transparent 69%)}
.crm-visual{width:100%;max-width:780px;margin:auto;padding:17px 12px}
.crm-dashboard{display:grid;grid-template-columns:148px minmax(0,1fr);min-height:365px;overflow:hidden;border-radius:16px;background:#fbfcf7;border:1px solid #cfdbc6;box-shadow:0 30px 60px -33px #1a2d1a68,0 0 0 7px #ecf1e6}
.crm-demo-sidebar{display:flex;flex-direction:column;padding:22px 15px;background:#1d2c22;color:#ecf4e9}.crm-demo-sidebar>strong{font-size:20px;font-weight:800;letter-spacing:-.07em;line-height:1}.crm-demo-sidebar>strong span{color:#d5f46a}.crm-demo-sidebar>small{margin-top:6px;font-size:7px;letter-spacing:.16em;color:#a9bf9f}.crm-demo-nav{display:grid;gap:5px;margin-top:34px}.crm-demo-nav>span{display:flex;align-items:center;gap:9px;border-radius:7px;padding:10px 9px;font-size:10px;color:#b8c7b3}.crm-demo-nav>span.is-active{background:#d5f46a;color:#23351c;font-weight:700}.crm-demo-nav i{font-size:14px;font-style:normal}.crm-demo-sidebar-foot{display:flex;align-items:center;gap:8px;margin-top:auto;font-size:8px;line-height:1.3;color:#9fb49a}.crm-demo-sidebar-foot i{width:5px;height:5px;flex:0 0 5px;background:#d5f46a;border-radius:50%;box-shadow:0 0 7px #d5f46a}
.crm-demo-main{min-width:0;padding:19px 22px 22px;color:#253321}.crm-demo-top{display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:14px;border-bottom:1px solid #dce4d6;font-size:8px;font-weight:700;letter-spacing:.11em;color:#75876b}.crm-demo-top i{font-style:normal;padding-inline:4px;color:#b1bda7}.crm-demo-top b{font-size:8px;letter-spacing:0;color:#668b42}.crm-demo-top b em{font-style:normal;font-weight:600;color:#718469}
.crm-demo-heading{display:flex;justify-content:space-between;align-items:center;margin:21px 0 19px}.crm-demo-heading>div{display:grid;gap:7px}.crm-demo-heading small{font-size:8px;font-weight:650;letter-spacing:.14em;color:#849578}.crm-demo-heading strong{font-size:27px;letter-spacing:-.06em;line-height:1.1}.crm-demo-heading>span{display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:#d5f46a;font-size:21px}
.crm-demo-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}.crm-demo-metrics>div{display:flex;flex-direction:column;min-width:0;padding:13px 12px;border:1px solid #dce4d6;border-radius:9px;background:#f5f8ee}.crm-demo-metrics small{font-size:7px;letter-spacing:.08em;font-weight:700;color:#788b6d;white-space:nowrap}.crm-demo-metrics strong{font-size:25px;letter-spacing:-.06em;line-height:1.3}.crm-demo-metrics em{font-size:8px;font-style:normal;color:#819077}
.crm-demo-pipeline{margin-top:19px}.crm-demo-pipeline-head{display:flex;justify-content:space-between;border-bottom:1px solid #dce4d6;padding-bottom:9px;color:#6e8065;font-size:8px;font-weight:700;letter-spacing:.09em}.crm-demo-pipeline-head>span:last-child{letter-spacing:0}.crm-demo-pipeline-head i{font-style:normal}.crm-demo-stages{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;padding-top:10px}.crm-demo-stages>div{min-width:0;display:grid;gap:6px;padding:11px;border:1px solid #e0e7db;border-radius:8px;background:#fff}.crm-demo-stages span{display:flex;align-items:center;gap:5px;font-size:8px;font-weight:700;color:#697f5b}.crm-demo-stages i{width:5px;height:5px;border-radius:50%;background:#a3bd75}.crm-demo-stages b{font-size:10px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.crm-demo-stages small{font-size:8px;color:#8c9a83}
@media(max-width:1100px){.crm-page .commerce-hero.commerce-hero-showcase{min-height:390px}.crm-visual{padding-inline:4px}.crm-dashboard{grid-template-columns:100px minmax(0,1fr);min-height:315px}.crm-demo-sidebar{padding:16px 8px}.crm-demo-sidebar>strong{font-size:16px}.crm-demo-nav>span{gap:5px;padding:7px 5px;font-size:8px}.crm-demo-main{padding:15px 12px}.crm-demo-heading{margin:15px 0}.crm-demo-heading strong{font-size:20px}.crm-demo-metrics{gap:5px}.crm-demo-metrics>div{padding:9px 7px}.crm-demo-metrics small{font-size:6px}.crm-demo-metrics strong{font-size:21px}.crm-demo-metrics em{font-size:6px}.crm-demo-stages{gap:5px}.crm-demo-stages>div{padding:7px}.crm-demo-stages span,.crm-demo-stages small{font-size:6px}.crm-demo-stages b{font-size:8px}}
@media(max-width:760px){.crm-page .commerce-hero.commerce-hero-showcase{min-height:335px;padding:22px 0 42px}.crm-visual{max-width:610px;padding:13px 4px}.crm-dashboard{grid-template-columns:104px minmax(0,1fr);min-height:315px}.crm-demo-sidebar{padding:17px 9px}.crm-demo-main{padding:16px}}
@media(max-width:430px){.crm-page .commerce-hero.commerce-hero-showcase{min-height:280px;padding:10px 0 32px}.crm-dashboard{display:block;min-height:0;border-radius:12px;box-shadow:0 22px 45px -26px #1a2d1a77,0 0 0 4px #ecf1e6}.crm-demo-sidebar{display:none}.crm-demo-main{padding:13px}.crm-demo-top{font-size:6px;padding-bottom:9px}.crm-demo-top b,.crm-demo-top b em{font-size:6px}.crm-demo-heading{margin:13px 0}.crm-demo-heading small{font-size:7px}.crm-demo-heading strong{font-size:20px}.crm-demo-heading>span{width:25px;height:25px;font-size:17px}.crm-demo-metrics{gap:6px}.crm-demo-metrics>div{padding:9px 7px}.crm-demo-metrics small{font-size:6px}.crm-demo-metrics strong{font-size:20px}.crm-demo-metrics em{font-size:7px}.crm-demo-pipeline{margin-top:13px}.crm-demo-stages{gap:5px}.crm-demo-stages>div{padding:7px 5px}.crm-demo-stages span,.crm-demo-stages small{font-size:6px}.crm-demo-stages b{font-size:8px}}
@media(max-width:345px){.crm-demo-metrics>div:last-child,.crm-demo-stages>div:last-child{display:none}.crm-demo-metrics,.crm-demo-stages{grid-template-columns:repeat(2,minmax(0,1fr))}}

/* Corporate web concept shown as a responsive desktop and phone pair. */
.corporate-web-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:28px 0 55px}
.corporate-web-page .commerce-hero-showcase:before{inset:8% -4%;background:radial-gradient(ellipse at 52% 53%,#c9d8b670,transparent 69%)}
.corporate-web-visual{position:relative;width:100%;max-width:780px;margin:auto;padding:12px 18% 36px 0}
.corporate-browser{position:relative;overflow:hidden;border:1px solid #4e584f;border-radius:14px;background:#17251d;box-shadow:0 28px 50px -27px #17271b80,0 0 0 7px #e9eee4;color:#f7f8f1}
.corporate-browser-bar{height:26px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;background:#ecf0e9;color:#6d8069}.corporate-browser-bar>span{display:flex;gap:3px}.corporate-browser-bar i{display:block;width:4px;height:4px;border-radius:50%;background:#9dac96}.corporate-browser-bar small{font-size:7px;font-weight:700;letter-spacing:.14em}.corporate-browser-bar b{font-size:13px;font-weight:400}
.corporate-site-preview{position:relative;overflow:hidden;padding:18px 22px 0;min-height:304px;background:#19291f}.corporate-site-preview:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 76% 54%,#49673e55,transparent 44%),linear-gradient(105deg,#19291f 35%,#17241bdc);pointer-events:none}
.corporate-preview-nav,.corporate-preview-main,.corporate-preview-foot{position:relative;z-index:1}.corporate-preview-nav{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px solid #ffffff36}.corporate-preview-nav strong{font-size:18px;letter-spacing:-.08em}.corporate-preview-nav strong span,.corporate-phone-site>strong span{font-size:8px;vertical-align:top;letter-spacing:0}.corporate-preview-nav>span{font-size:7px;color:#c2cbbb;word-spacing:13px}.corporate-preview-nav i{font-style:normal}.corporate-preview-nav>b{display:none;font-size:7px;font-weight:550;letter-spacing:.1em}
.corporate-preview-main{display:grid;grid-template-columns:minmax(0,1fr) 145px;align-items:center;gap:8px;min-height:226px}.corporate-preview-main>div:first-child{display:flex;flex-direction:column;align-items:flex-start}.corporate-preview-main small{font-size:7px;font-weight:650;letter-spacing:.15em;color:#c6d89e;margin-bottom:15px}.corporate-preview-main strong{font-size:clamp(25px,2.35vw,34px);line-height:1.08;letter-spacing:-.06em;font-weight:650}.corporate-preview-main strong em{font-style:normal;color:#d5f46a}.corporate-preview-main>div:first-child>span{max-width:190px;margin-top:12px;font-size:8px;line-height:1.5;color:#c1cfc0}.corporate-preview-main>div:first-child>b{display:flex;align-items:center;gap:14px;margin-top:16px;padding:7px 12px;border:1px solid #a3b69d;border-radius:30px;font-size:7px;font-weight:550}.corporate-preview-main>div:first-child>b i{font-size:11px;font-style:normal;color:#d5f46a}
.corporate-preview-art{position:relative;height:170px;isolation:isolate}.corporate-preview-art>i{position:absolute;inset:2% 0 0;border:1px solid #c7dea76b;border-radius:50%;transform:rotate(-24deg) scaleX(.72)}.corporate-preview-art>i+i{inset:16% 11%;transform:rotate(36deg) scaleX(.77);border-color:#c7dea747}.corporate-preview-art>span{position:absolute;inset:0;display:grid;place-items:center;font-size:47px;font-weight:800;letter-spacing:-.12em;color:#d5f46a;text-shadow:0 0 30px #d5f46a45}
.corporate-preview-foot{display:flex;gap:25px;padding:10px 0;border-top:1px solid #ffffff28;font-size:7px;letter-spacing:.13em;color:#aabca7}
.corporate-phone{position:absolute;z-index:2;right:0;bottom:0;width:26%;max-width:172px;padding:5px;border:1px solid #7f8980;border-radius:24px;background:linear-gradient(110deg,#b8c1b4,#5a6658 12%,#d8ded3 45%,#7e897b 90%);box-shadow:0 19px 33px #162d1c4d,0 2px 4px #162d1c44}.corporate-phone-top{display:flex;justify-content:space-between;padding:5px 9px 2px;border-radius:18px 18px 0 0;background:#1b2a20;color:#e7ede4;font-size:5px}.corporate-phone-top i{width:31%;height:7px;border-radius:9px;background:#050b07}.corporate-phone-site{position:relative;overflow:hidden;min-height:242px;padding:13px 11px;background:#18291d;color:#f4f7ed}.corporate-phone-site>strong{display:flex;justify-content:space-between;font-size:17px;letter-spacing:-.08em}.corporate-phone-site>strong b{font-size:11px;font-weight:400}.corporate-phone-site>small{display:block;margin:30px 0 10px;color:#b8cda6;font-size:5px;letter-spacing:.12em}.corporate-phone-site>div{position:relative;z-index:1;font-size:21px;line-height:1.12;font-weight:650;letter-spacing:-.06em}.corporate-phone-site>div em{color:#d5f46a;font-style:normal}.corporate-phone-orbit{position:absolute;right:-25px;bottom:30px;width:95px;height:95px;border:1px solid #a8c28c88;border-radius:50%;box-shadow:0 0 0 20px #b6d38a0b}.corporate-phone-site>span{position:relative;z-index:1;display:inline-block;margin-top:18px;padding:6px 8px;border:1px solid #b4ca9d;border-radius:12px;font-size:6px}.corporate-phone-home{height:8px;position:relative;border-radius:0 0 17px 17px;background:#1b2a20}.corporate-phone-home:after{content:'';position:absolute;left:35%;top:3px;width:30%;height:2px;background:#d7e4d4;border-radius:4px}
@media(max-width:1100px){.corporate-web-page .commerce-hero.commerce-hero-showcase{min-height:405px}.corporate-web-visual{padding-right:17%}.corporate-site-preview{min-height:260px;padding:13px 14px 0}.corporate-preview-main{grid-template-columns:minmax(0,1fr) 90px;min-height:200px}.corporate-preview-main strong{font-size:23px}.corporate-preview-art{height:120px}.corporate-preview-art>span{font-size:34px}.corporate-preview-nav>span{display:none}.corporate-preview-nav>b{display:block}.corporate-phone{width:30%;border-radius:17px}.corporate-phone-site{min-height:190px;padding:10px 7px}.corporate-phone-site>small{margin-top:20px}.corporate-phone-site>div{font-size:15px}.corporate-phone-orbit{width:64px;height:64px}.corporate-phone-site>span{margin-top:13px}}
@media(max-width:760px){.corporate-web-page .commerce-hero.commerce-hero-showcase{min-height:365px;padding:20px 0 55px}.corporate-web-visual{max-width:620px;padding:10px 17% 32px 0}.corporate-site-preview{min-height:275px}.corporate-preview-main{grid-template-columns:minmax(0,1fr) 120px;min-height:218px}.corporate-preview-main strong{font-size:27px}.corporate-phone-site{min-height:215px}.corporate-phone-site>div{font-size:18px}}
@media(max-width:430px){.corporate-web-page .commerce-hero.commerce-hero-showcase{min-height:295px;padding:10px 0 38px}.corporate-web-visual{padding:9px 16% 17px 0}.corporate-browser{border-radius:9px;box-shadow:0 20px 38px -23px #17271b8c,0 0 0 4px #e9eee4}.corporate-browser-bar{height:18px;padding:0 7px}.corporate-browser-bar small{font-size:5px}.corporate-site-preview{min-height:203px;padding:9px 9px 0}.corporate-preview-nav{padding-bottom:6px}.corporate-preview-nav strong{font-size:12px}.corporate-preview-nav>b{font-size:5px}.corporate-preview-main{grid-template-columns:minmax(0,1fr) 55px;min-height:170px}.corporate-preview-main small{font-size:5px;margin-bottom:9px}.corporate-preview-main strong{font-size:17px}.corporate-preview-main>div:first-child>span{font-size:6px;margin-top:6px}.corporate-preview-main>div:first-child>b{font-size:5px;margin-top:9px;padding:4px 7px}.corporate-preview-art{height:72px}.corporate-preview-art>span{font-size:23px}.corporate-preview-foot{gap:8px;padding:6px 0;font-size:5px}.corporate-phone{width:30%;padding:3px;border-radius:12px}.corporate-phone-top{font-size:4px;padding:3px 4px 1px}.corporate-phone-top i{height:5px}.corporate-phone-site{min-height:144px;padding:6px 5px}.corporate-phone-site>strong{font-size:11px}.corporate-phone-site>strong b{font-size:8px}.corporate-phone-site>small{font-size:4px;margin:16px 0 6px}.corporate-phone-site>div{font-size:12px}.corporate-phone-orbit{width:48px;height:48px;right:-18px}.corporate-phone-site>span{font-size:4px;margin-top:8px;padding:4px 5px}.corporate-phone-home{height:5px}.corporate-phone-home:after{top:2px;height:1px}}

/* A fictional hotel site preview keeps this service distinct from real portfolio projects. */
.hotel-web-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:28px 0 55px}
.hotel-web-page .commerce-hero-showcase:before{inset:6% -4%;background:radial-gradient(ellipse at 50% 55%,#d4ddcc85,transparent 68%)}
.hotel-web-visual{position:relative;width:100%;max-width:780px;margin:auto;padding:12px 18% 36px 0}
.hotel-browser{position:relative;overflow:hidden;border:1px solid #77847a;border-radius:14px;background:#253f3c;box-shadow:0 28px 55px -27px #1a353480,0 0 0 7px #e9eee6;color:#fffdf5}
.hotel-browser-bar{height:26px;display:flex;align-items:center;justify-content:space-between;padding:0 13px;background:#edf0e9;color:#748276}.hotel-browser-bar>span{display:flex;gap:3px}.hotel-browser-bar i{display:block;width:4px;height:4px;border-radius:50%;background:#a3b4aa}.hotel-browser-bar small{font-size:7px;font-weight:700;letter-spacing:.12em}.hotel-browser-bar b{font-size:13px;font-weight:400}
.hotel-site-preview{position:relative;isolation:isolate;min-height:318px;padding:18px 21px 16px;background:#315553 url('../img/hotel-web-scene.svg') center 43%/cover no-repeat}.hotel-site-preview:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#102b2ac7 0%,#14312e80 45%,#122b2b10 100%)}
.hotel-preview-nav{display:flex;justify-content:space-between;align-items:center;padding-bottom:12px;border-bottom:1px solid #ffffff9c}.hotel-preview-nav strong{font-family:Georgia,serif;font-size:17px;letter-spacing:.12em;font-weight:400}.hotel-preview-nav strong span{display:block;margin-top:0;font:600 6px/1 sans-serif;letter-spacing:.31em;text-align:center}.hotel-preview-nav>span{font-size:7px;letter-spacing:.03em}.hotel-preview-nav>b{display:none;font-size:7px;font-weight:550;letter-spacing:.1em}
.hotel-preview-main{display:flex;flex-direction:column;align-items:flex-start;justify-content:center;min-height:212px}.hotel-preview-main>small{margin-bottom:12px;font-size:7px;font-weight:700;letter-spacing:.15em;color:#f2dfaf}.hotel-preview-main>strong{font-family:Georgia,serif;font-size:clamp(28px,2.8vw,39px);font-weight:400;line-height:1.04;letter-spacing:-.055em}.hotel-preview-main>strong em{font-style:italic;color:#f1ddb0}.hotel-preview-main>span{max-width:205px;margin-top:12px;font-size:8px;line-height:1.5;color:#eee9dc}.hotel-preview-main>b{display:flex;gap:12px;align-items:center;margin-top:15px;padding:7px 11px;border:1px solid #ffffffb5;border-radius:18px;font-size:7px;font-weight:600}.hotel-preview-main>b i{font-style:normal;font-size:11px}
.hotel-preview-booking{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) auto;align-items:center;gap:0;background:#f7f6ed;color:#253d38;border-radius:5px;box-shadow:0 10px 25px #132a2640}.hotel-preview-booking>span{display:flex;flex-direction:column;gap:4px;margin:8px 0;padding:0 10px;border-right:1px solid #d8ded4;font-size:6px;font-weight:700;letter-spacing:.12em;color:#8a9890}.hotel-preview-booking>span b{font-size:9px;font-weight:600;letter-spacing:0;color:#263d38}.hotel-preview-booking>strong{align-self:stretch;display:grid;place-items:center;padding:0 13px;background:#1c3c36;color:#fffdf3;font-size:8px;font-weight:600}
.hotel-phone{position:absolute;z-index:2;right:0;bottom:0;width:26%;max-width:172px;padding:5px;border:1px solid #8e9992;border-radius:24px;background:linear-gradient(115deg,#d6ded5,#54635d 12%,#e1e7dc 45%,#88968b 90%);box-shadow:0 19px 34px #17332f50,0 2px 4px #17332f40}.hotel-phone-top{display:flex;justify-content:space-between;padding:5px 9px 2px;border-radius:18px 18px 0 0;background:#1d3633;color:#f3eee5;font-size:5px}.hotel-phone-top i{width:31%;height:7px;border-radius:9px;background:#061310}.hotel-phone-site{position:relative;display:flex;flex-direction:column;overflow:hidden;min-height:252px;padding:14px 11px;background:#315553 url('../img/hotel-web-scene.svg') center/auto 100% no-repeat;color:#fffdf4}.hotel-phone-site:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#102b2aa0,#102b2a45 45%,#102b2aaa);pointer-events:none}.hotel-phone-site>*{position:relative;z-index:1}.hotel-phone-site>strong{display:flex;align-items:baseline;gap:3px;font-family:Georgia,serif;font-size:15px;letter-spacing:.1em;font-weight:400}.hotel-phone-site>strong small{font:600 5px sans-serif;letter-spacing:.15em}.hotel-phone-site>strong b{margin-left:auto;font:12px sans-serif}.hotel-phone-site>div{margin-top:auto}.hotel-phone-site>div small{display:block;margin-bottom:9px;font:600 5px sans-serif;letter-spacing:.1em;color:#f4ddb5}.hotel-phone-site>div span{display:block;font-family:Georgia,serif;font-size:19px;line-height:1.08;letter-spacing:-.035em}.hotel-phone-site>div em{font-style:italic;color:#f1d9aa}.hotel-phone-site>p{align-self:flex-start;margin:15px 0 3px;padding:6px 8px;border:1px solid #ffffffb5;border-radius:20px;font-size:6px}.hotel-phone-home{height:8px;position:relative;border-radius:0 0 17px 17px;background:#1d3633}.hotel-phone-home:after{content:'';position:absolute;left:35%;top:3px;width:30%;height:2px;background:#d7e4d4;border-radius:4px}
@media(max-width:1100px){.hotel-web-page .commerce-hero.commerce-hero-showcase{min-height:405px}.hotel-site-preview{min-height:280px;padding:13px 14px 12px}.hotel-preview-main{min-height:194px}.hotel-preview-main>strong{font-size:29px}.hotel-preview-nav>span{display:none}.hotel-preview-nav>b{display:block}.hotel-preview-booking{grid-template-columns:repeat(3,minmax(0,1fr));max-width:84%}.hotel-preview-booking>strong{display:none}.hotel-phone{width:30%;border-radius:17px}.hotel-phone-site{min-height:204px;padding:10px 7px}.hotel-phone-site>div span{font-size:16px}.hotel-phone-site>p{margin-top:10px}}
@media(min-width:761px) and (max-width:900px){.hotel-web-page .commerce-first-row{grid-template-columns:1fr;gap:16px}.hotel-web-page .commerce-hero.commerce-hero-showcase{min-height:430px}.hotel-web-visual{max-width:680px}.hotel-preview-booking{max-width:87%}}
@media(max-width:760px){.hotel-web-page .commerce-hero.commerce-hero-showcase{min-height:365px;padding:20px 0 55px}.hotel-web-visual{max-width:620px;padding:10px 17% 32px 0}.hotel-site-preview{min-height:275px}.hotel-preview-main{min-height:195px}.hotel-preview-main>strong{font-size:30px}.hotel-phone-site{min-height:215px}.hotel-phone-site>div span{font-size:18px}}
@media(max-width:430px){.hotel-web-page .commerce-hero.commerce-hero-showcase{min-height:295px;padding:10px 0 38px}.hotel-web-visual{padding:9px 16% 17px 0}.hotel-browser{border-radius:9px;box-shadow:0 20px 38px -23px #172e298c,0 0 0 4px #e9eee4}.hotel-browser-bar{height:18px;padding:0 7px}.hotel-browser-bar small{font-size:5px}.hotel-site-preview{min-height:207px;padding:8px 9px 9px}.hotel-preview-nav{padding-bottom:6px}.hotel-preview-nav strong{font-size:10px}.hotel-preview-nav strong span{font-size:4px}.hotel-preview-nav>b{font-size:5px}.hotel-preview-main{min-height:151px}.hotel-preview-main>small{font-size:5px;margin-bottom:7px}.hotel-preview-main>strong{font-size:19px}.hotel-preview-main>span{max-width:110px;font-size:5px;margin-top:6px}.hotel-preview-main>b{font-size:5px;margin-top:8px;padding:4px 6px}.hotel-preview-booking>span{gap:2px;margin:4px 0;padding:0 4px;font-size:4px}.hotel-preview-booking>span b{font-size:5px}.hotel-preview-booking>strong{padding:0 5px;font-size:5px}.hotel-phone{width:30%;padding:3px;border-radius:12px}.hotel-phone-top{font-size:4px;padding:3px 4px 1px}.hotel-phone-top i{height:5px}.hotel-phone-site{min-height:148px;padding:7px 5px}.hotel-phone-site>strong{font-size:10px}.hotel-phone-site>strong small{font-size:3px}.hotel-phone-site>strong b{font-size:8px}.hotel-phone-site>div small{font-size:4px;margin-bottom:5px}.hotel-phone-site>div span{font-size:12px}.hotel-phone-site>p{font-size:4px;margin-top:8px;padding:4px 5px}.hotel-phone-home{height:5px}.hotel-phone-home:after{top:2px;height:1px}}

/* Mobile UX concept: wireframe, primary interface, and detail state. */
.mobile-ui-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:22px 0 44px}
.mobile-ui-page .commerce-hero-showcase:before{inset:0 -5%;background:radial-gradient(circle at 55% 48%,#d5e1c085,transparent 57%)}
.mobile-ui-visual{position:relative;width:100%;max-width:740px;margin:auto;isolation:isolate}
.mobile-ui-orbit{position:absolute;z-index:-1;inset:8% 3%;border:1px solid #b9c9ad88;border-radius:50%;transform:rotate(-15deg) scaleY(.78)}.mobile-ui-orbit i:first-child{position:absolute;inset:9% 8%;border:1px solid #b9c9ad66;border-radius:50%}.mobile-ui-orbit i:last-child{position:absolute;width:7px;height:7px;right:7%;top:15%;border-radius:50%;background:#b2ca7d;box-shadow:0 0 0 7px #b2ca7d24}
.mobile-ui-stage{position:relative;height:405px}
.mobile-ui-phone{position:absolute;overflow:hidden;display:flex;flex-direction:column;aspect-ratio:.5;border:5px solid #26392e;border-radius:27px;background:#f7f8ef;box-shadow:0 26px 45px -22px #172b2070,0 0 0 1px #738b79,0 0 0 5px #e7ede2}
.mobile-ui-phone--wire{z-index:1;width:27%;left:3%;top:66px;transform:rotate(-10deg);border-color:#9cae9f;background:#f7f8f3;opacity:.96}
.mobile-ui-phone--main{z-index:3;width:33%;left:33%;top:13px;border-color:#203729;box-shadow:0 34px 55px -25px #172b2080,0 0 0 1px #48674d,0 0 0 5px #e6ede1}
.mobile-ui-phone--detail{z-index:2;width:27%;right:2%;top:68px;transform:rotate(10deg);border-color:#7b9280;background:#edf2e6}
.mobile-ui-notch{position:absolute;z-index:8;left:35%;top:5px;width:30%;height:10px;border-radius:0 0 8px 8px;background:#17261c}.mobile-ui-phone--wire .mobile-ui-notch,.mobile-ui-phone--detail .mobile-ui-notch{height:8px;background:#69806e}.mobile-ui-home{position:absolute;z-index:8;bottom:4px;left:34%;width:32%;height:3px;border-radius:8px;background:#708973}.mobile-ui-phone--main .mobile-ui-home{background:#acbaa2}
.mobile-ui-wire-screen{display:flex;flex-direction:column;flex:1;padding:23px 12px 12px;background:#f5f7f1}.mobile-ui-wire-top{display:flex;justify-content:space-between}.mobile-ui-wire-top span{width:27%;height:10px;border-radius:3px;background:#9aaa9c}.mobile-ui-wire-top i{width:11px;height:11px;border:1px solid #a7b6a7;border-radius:50%}.mobile-ui-wire-heading{margin-top:27px}.mobile-ui-wire-heading b{display:block;width:76%;height:9px;margin-bottom:6px;border-radius:4px;background:#a7b6a5}.mobile-ui-wire-heading b+b{width:52%;background:#cfddc6}.mobile-ui-wire-hero{position:relative;height:82px;margin-top:20px;border:1px solid #b6c5b4;border-radius:8px;background:#e7ede1}.mobile-ui-wire-hero i{position:absolute;top:14px;left:15px;width:32px;height:32px;border:1px solid #abc2aa;border-radius:50%}.mobile-ui-wire-hero span{position:absolute;bottom:23px;left:15px;width:65%;height:5px;border-radius:3px;background:#adbfaa}.mobile-ui-wire-hero span:last-child{bottom:12px;width:43%;background:#cedac9}.mobile-ui-wire-line{height:6px;width:76%;margin-top:20px;border-radius:4px;background:#a7bba9}.mobile-ui-wire-line.short{width:44%;margin-top:15px}.mobile-ui-wire-cards{display:flex;gap:7px;margin-top:12px}.mobile-ui-wire-cards span{height:60px;flex:1;border:1px solid #bfcebf;border-radius:6px;background:linear-gradient(#e0eade 58%,#b5c7b5 59% 64%,#e0eade 65%)}.mobile-ui-wire-bottom{display:flex;justify-content:space-around;margin-top:auto;padding-top:16px;border-top:1px solid #d3dfd1}.mobile-ui-wire-bottom i{width:12px;height:12px;border:1px solid #b7c8b5;border-radius:50%}
.mobile-ui-app{display:flex;flex-direction:column;flex:1;overflow:hidden;padding:25px 14px 11px;background:radial-gradient(circle at 93% 7%,#47694a 0,transparent 45%),#1c3324;color:#f5f7ec}.mobile-ui-app-top{display:flex;justify-content:space-between;align-items:center}.mobile-ui-app-top strong{font-size:16px;letter-spacing:-.08em}.mobile-ui-app-top strong span,.mobile-ui-detail-top strong span{font-size:7px;vertical-align:top;letter-spacing:0}.mobile-ui-app-top>span{font-size:13px;color:#d4e4cf}.mobile-ui-app-greeting{display:flex;flex-direction:column;margin-top:27px}.mobile-ui-app-greeting small{font-size:6px;letter-spacing:.15em;color:#d0e6b2}.mobile-ui-app-greeting strong{margin-top:10px;font-size:25px;font-weight:620;line-height:1.05;letter-spacing:-.06em}.mobile-ui-app-greeting strong em{color:#d8f46e;font-style:normal}.mobile-ui-app-greeting>span{margin-top:9px;font-size:7px;line-height:1.45;color:#c1d3ba}.mobile-ui-app-progress{display:flex;align-items:center;justify-content:space-between;margin-top:24px;padding:11px 10px;border:1px solid #7b9d754d;border-radius:11px;background:#ffffff12}.mobile-ui-app-progress>div{display:flex;flex-direction:column;gap:5px}.mobile-ui-app-progress small{font-size:5px;letter-spacing:.08em;color:#b3caa8}.mobile-ui-app-progress b{font-size:12px}.mobile-ui-app-progress>i{display:grid;place-items:center;width:37px;height:37px;border-radius:50%;background:conic-gradient(#d8f46e 0 64%,#658369 64% 100%)}.mobile-ui-app-progress>i span{width:25px;height:25px;border-radius:50%;background:#284633}.mobile-ui-app-card{display:flex;flex-direction:column;align-items:flex-start;margin-top:11px;padding:12px 10px;border-radius:11px;background:#d9edb6;color:#1b3424}.mobile-ui-app-card small{font-size:5px;letter-spacing:.12em;font-weight:700}.mobile-ui-app-card strong{margin-top:8px;font-size:13px;line-height:1.1;letter-spacing:-.04em}.mobile-ui-app-card>span{margin-top:5px;font-size:6px}.mobile-ui-app-card>b{display:flex;align-items:center;gap:14px;margin-top:10px;padding:5px 7px;border-radius:20px;background:#203d27;color:#f5f8ec;font-size:6px}.mobile-ui-app-card>b i{font-style:normal}.mobile-ui-app-nav{display:flex;justify-content:space-around;gap:4px;margin-top:auto;padding-top:13px}.mobile-ui-app-nav span{display:flex;flex-direction:column;align-items:center;gap:2px;font-size:13px;color:#c5d9c2}.mobile-ui-app-nav small{font-size:5px}.mobile-ui-app-nav span:first-child{color:#d8f46e}
.mobile-ui-detail-app{display:flex;flex-direction:column;flex:1;overflow:hidden;padding:23px 11px 13px;background:#edf2e5;color:#1e3426}.mobile-ui-detail-top{display:flex;align-items:center;justify-content:space-between}.mobile-ui-detail-top>span{font-size:13px}.mobile-ui-detail-top strong{font-size:13px;letter-spacing:-.08em}.mobile-ui-detail-art{position:relative;height:113px;overflow:hidden;margin-top:25px;border-radius:11px;background:radial-gradient(circle at 60% 55%,#d5e9a2,#92b781 63%,#52765a)}.mobile-ui-detail-art i{position:absolute;border:1px solid #f3f8d599;border-radius:50%;width:100px;height:100px;left:18%;top:6%;transform:scaleX(.7) rotate(36deg)}.mobile-ui-detail-art i+i{left:35%;transform:scaleX(.7) rotate(-48deg)}.mobile-ui-detail-art span{position:absolute;bottom:10px;left:11px;font-size:28px;font-weight:700;color:#f2f7d8}.mobile-ui-detail-app>small{margin-top:17px;font-size:5px;font-weight:700;letter-spacing:.13em;color:#778c72}.mobile-ui-detail-app>strong{margin-top:7px;font-size:19px;line-height:1.1;letter-spacing:-.055em}.mobile-ui-detail-app>p{margin:9px 0;font-size:6px;line-height:1.5;color:#617164}.mobile-ui-detail-stats{display:flex;gap:8px;margin-top:5px}.mobile-ui-detail-stats span{font-size:8px;color:#5f8267}.mobile-ui-detail-stats b{font-size:6px;color:#284032}.mobile-ui-detail-button{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding:8px 10px;border-radius:15px;background:#23432c;color:#fff;font-size:7px;font-weight:600}.mobile-ui-detail-button span{font-size:11px}
.mobile-ui-concept-note{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:3px;color:#7c8e77;font-size:8px;letter-spacing:.13em;font-weight:650}.mobile-ui-concept-note i{width:22px;height:1px;background:#b5c4ad}.mobile-ui-concept-note small{margin-left:auto;color:#9aa99a;font-size:7px;letter-spacing:.1em}
@media(max-width:1100px){.mobile-ui-page .commerce-hero.commerce-hero-showcase{min-height:410px}.mobile-ui-stage{height:345px}.mobile-ui-phone{border-width:4px;border-radius:21px}.mobile-ui-phone--wire{top:50px}.mobile-ui-phone--detail{top:52px}.mobile-ui-wire-screen{padding:18px 8px 9px}.mobile-ui-wire-heading{margin-top:18px}.mobile-ui-wire-hero{height:60px;margin-top:13px}.mobile-ui-wire-cards span{height:45px}.mobile-ui-app{padding:20px 10px 8px}.mobile-ui-app-greeting{margin-top:18px}.mobile-ui-app-greeting strong{font-size:19px}.mobile-ui-app-progress{margin-top:15px;padding:8px}.mobile-ui-app-card{padding:9px 8px}.mobile-ui-app-card strong{font-size:10px}.mobile-ui-app-nav{padding-top:7px}.mobile-ui-detail-app{padding:20px 8px 9px}.mobile-ui-detail-art{height:79px;margin-top:18px}.mobile-ui-detail-app>strong{font-size:15px}.mobile-ui-detail-app>small{margin-top:10px}.mobile-ui-detail-app>p{font-size:5px}.mobile-ui-concept-note small{display:none}}
@media(min-width:761px) and (max-width:900px){.mobile-ui-page .commerce-first-row{grid-template-columns:1fr;gap:14px}.mobile-ui-page .commerce-hero.commerce-hero-showcase{min-height:470px}.mobile-ui-visual{max-width:660px}.mobile-ui-stage{height:405px}}
@media(max-width:760px){.mobile-ui-page .commerce-hero.commerce-hero-showcase{min-height:370px;padding:14px 0 38px}.mobile-ui-visual{max-width:570px}.mobile-ui-stage{height:clamp(275px,70vw,500px)}.mobile-ui-phone--wire{left:1%}.mobile-ui-phone--main{left:33%}.mobile-ui-phone--detail{right:1%}}
@media(max-width:430px){.mobile-ui-page .commerce-hero.commerce-hero-showcase{min-height:300px;padding:9px 0 31px}.mobile-ui-stage{height:275px}.mobile-ui-phone{border-width:3px;border-radius:14px;box-shadow:0 17px 30px -18px #172b2080,0 0 0 1px #6e8e72,0 0 0 3px #e7ede2}.mobile-ui-phone--wire{width:30%;top:43px}.mobile-ui-phone--main{width:38%;left:31%;top:8px}.mobile-ui-phone--detail{width:30%;top:45px}.mobile-ui-notch{top:3px;height:5px}.mobile-ui-home{bottom:2px;height:2px}.mobile-ui-wire-screen{padding:13px 5px 7px}.mobile-ui-wire-top span{height:6px}.mobile-ui-wire-top i{width:7px;height:7px}.mobile-ui-wire-heading{margin-top:13px}.mobile-ui-wire-heading b{height:5px;margin-bottom:4px}.mobile-ui-wire-hero{height:45px;margin-top:9px}.mobile-ui-wire-hero i{top:6px;left:7px;width:18px;height:18px}.mobile-ui-wire-hero span{left:7px;bottom:13px;height:3px}.mobile-ui-wire-hero span:last-child{bottom:6px}.mobile-ui-wire-line{height:4px;margin-top:10px}.mobile-ui-wire-cards{gap:4px;margin-top:8px}.mobile-ui-wire-cards span{height:29px}.mobile-ui-wire-bottom{padding-top:6px}.mobile-ui-wire-bottom i{width:7px;height:7px}.mobile-ui-app{padding:14px 7px 6px}.mobile-ui-app-top strong{font-size:11px}.mobile-ui-app-top>span{font-size:8px}.mobile-ui-app-greeting{margin-top:14px}.mobile-ui-app-greeting small{font-size:4px}.mobile-ui-app-greeting strong{margin-top:6px;font-size:16px}.mobile-ui-app-greeting>span{margin-top:5px;font-size:5px}.mobile-ui-app-progress{margin-top:11px;padding:6px 5px;border-radius:6px}.mobile-ui-app-progress small{font-size:3px}.mobile-ui-app-progress b{font-size:8px}.mobile-ui-app-progress>i{width:22px;height:22px}.mobile-ui-app-progress>i span{width:15px;height:15px}.mobile-ui-app-card{margin-top:6px;padding:7px 5px;border-radius:7px}.mobile-ui-app-card small{font-size:3px}.mobile-ui-app-card strong{margin-top:5px;font-size:8px}.mobile-ui-app-card>span{font-size:4px;margin-top:3px}.mobile-ui-app-card>b{margin-top:6px;padding:4px 5px;font-size:4px}.mobile-ui-app-nav{padding-top:6px}.mobile-ui-app-nav span{font-size:9px}.mobile-ui-app-nav small{font-size:3px}.mobile-ui-detail-app{padding:14px 6px 7px}.mobile-ui-detail-top>span{font-size:9px}.mobile-ui-detail-top strong{font-size:9px}.mobile-ui-detail-art{height:60px;margin-top:13px;border-radius:6px}.mobile-ui-detail-art i{width:60px;height:60px}.mobile-ui-detail-art span{font-size:17px}.mobile-ui-detail-app>small{margin-top:8px;font-size:3px}.mobile-ui-detail-app>strong{font-size:11px;margin-top:4px}.mobile-ui-detail-app>p{font-size:4px;margin:5px 0}.mobile-ui-detail-stats{gap:4px}.mobile-ui-detail-stats span{font-size:5px}.mobile-ui-detail-stats b{font-size:4px}.mobile-ui-detail-button{padding:5px 6px;font-size:4px}.mobile-ui-detail-button span{font-size:7px}.mobile-ui-concept-note{gap:5px;font-size:5px}.mobile-ui-concept-note i{width:11px}}
@media(min-width:1101px){.mobile-ui-app-greeting{margin-top:17px}.mobile-ui-app-progress{margin-top:14px}.mobile-ui-app-card{margin-top:7px;padding:9px 10px}.mobile-ui-app-nav{padding-top:7px}}

/* Mobile software: the app, its management view, and connected data. */
.mobile-software-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:20px 0 44px}
.mobile-software-page .commerce-hero-showcase:before{inset:1% -4%;background:radial-gradient(circle at 54% 52%,#cddcbd91,transparent 64%)}
.mobile-system-visual{position:relative;width:100%;max-width:760px;margin:auto;isolation:isolate}
.mobile-system-orbits{position:absolute;z-index:-1;inset:6% 0 3%;border:1px solid #b8c8ad88;border-radius:50%;transform:rotate(-14deg) scaleY(.77)}.mobile-system-orbits i:first-child{position:absolute;inset:12% 9%;border:1px solid #b8c8ad6b;border-radius:50%}.mobile-system-orbits i:last-child{position:absolute;right:6%;top:17%;width:8px;height:8px;border-radius:50%;background:#b7d183;box-shadow:0 0 0 8px #b7d18329}
.mobile-system-stage{position:relative;height:405px}
.mobile-system-panel{position:absolute;z-index:1;left:0;top:90px;width:42%;padding:14px 13px;border:1px solid #c9d6c5;border-radius:13px;background:#f8faf4;box-shadow:0 24px 43px -27px #1c3e3270;transform:rotate(-5deg);color:#273e30}.mobile-system-panel-top{display:flex;justify-content:space-between;gap:4px;align-items:center;font-size:6px;letter-spacing:.1em;font-weight:750;color:#71896d}.mobile-system-panel-top b{display:flex;align-items:center;gap:3px;font-size:5px;color:#4a8055}.mobile-system-panel-top b i{width:5px;height:5px;border-radius:50%;background:#60aa65}.mobile-system-panel>strong{display:block;margin-top:17px;font-size:17px;letter-spacing:-.05em}.mobile-system-panel>small{display:block;margin-top:2px;font-size:7px;color:#829282}.mobile-system-panel-stats{display:flex;gap:6px;margin-top:14px}.mobile-system-panel-stats span{display:flex;flex-direction:column;gap:2px;flex:1;padding:7px;border-radius:7px;background:#e7f0df;font-size:6px;color:#5e775e}.mobile-system-panel-stats b{font-size:18px;color:#2c5239}.mobile-system-panel-chart{display:flex;align-items:end;gap:5px;height:55px;margin:9px 0 3px;padding:6px 7px;background:linear-gradient(180deg,#eef4e9,#f7faf3);border-radius:7px}.mobile-system-panel-chart i{flex:1;height:40%;border-radius:3px 3px 0 0;background:#9dc88f}.mobile-system-panel-chart i:nth-child(2){height:66%}.mobile-system-panel-chart i:nth-child(3){height:52%}.mobile-system-panel-chart i:nth-child(4){height:85%;background:#497b57}.mobile-system-panel-chart i:nth-child(5){height:70%}.mobile-system-panel-chart i:nth-child(6){height:93%;background:#b8db77}.mobile-system-panel-chart i:nth-child(7){height:78%}.mobile-system-panel-row{display:flex;justify-content:space-between;padding:7px 0;border-bottom:1px solid #e0e8db;font-size:7px;color:#617568}.mobile-system-panel-row b{font-size:7px;color:#2d5b3a}
.mobile-system-phone{position:absolute;z-index:3;left:35%;top:8px;width:34%;aspect-ratio:.51;display:flex;flex-direction:column;overflow:hidden;padding:5px;border:1px solid #536d58;border-radius:25px;background:#183526;box-shadow:0 31px 55px -28px #112d1d8c,0 0 0 6px #e8eee3}.mobile-system-notch{position:absolute;z-index:5;left:34%;top:6px;width:32%;height:10px;border-radius:0 0 8px 8px;background:#0a1b12}.mobile-system-app{display:flex;flex:1;flex-direction:column;overflow:hidden;padding:24px 11px 12px;border-radius:20px 20px 14px 14px;background:radial-gradient(circle at 90% 1%,#567d55,transparent 42%),#1b3928;color:#f4f7ea}.mobile-system-app-top{display:flex;justify-content:space-between;align-items:center}.mobile-system-app-top strong{font-size:18px;letter-spacing:-.09em}.mobile-system-app-top strong span{font-size:7px;vertical-align:top;letter-spacing:0}.mobile-system-app-top>span{font-size:11px;color:#c9dcc3}.mobile-system-greeting{display:flex;flex-direction:column;margin-top:21px}.mobile-system-greeting small{font-size:5px;letter-spacing:.14em;color:#b8d6a5}.mobile-system-greeting strong{margin-top:8px;font-size:27px;line-height:1.02;letter-spacing:-.07em}.mobile-system-greeting em{font-style:normal;color:#d6f36e}.mobile-system-greeting>span{margin-top:7px;font-size:7px;color:#c7d9c0}.mobile-system-summary{display:flex;flex-direction:column;margin-top:18px;padding:10px 10px;border:1px solid #7c9d755d;border-radius:11px;background:#ffffff13}.mobile-system-summary small{font-size:5px;letter-spacing:.1em;color:#b7d0ad}.mobile-system-summary strong{display:flex;justify-content:space-between;align-items:center;margin-top:3px;font-size:29px;line-height:1}.mobile-system-summary strong span{font-size:12px;color:#d6f36e}.mobile-system-summary>span{margin-top:5px;font-size:6px;color:#c0d1ba}.mobile-system-app-label{margin:15px 0 5px;font-size:5px;letter-spacing:.12em;color:#bed0b7}.mobile-system-task{display:flex;align-items:center;gap:7px;padding:9px 0;border-top:1px solid #78947555}.mobile-system-task i{display:grid;place-items:center;flex:0 0 23px;height:23px;border-radius:6px;background:#d6edb7;color:#264831;font-size:11px;font-style:normal}.mobile-system-task>span{display:flex;flex:1;flex-direction:column;gap:3px;min-width:0}.mobile-system-task b{font-size:7px;white-space:nowrap}.mobile-system-task small{font-size:5px;color:#a9c3a7}.mobile-system-task em{font-size:9px;font-style:normal;color:#cde2c5}.mobile-system-app-nav{display:flex;justify-content:space-around;margin-top:auto;padding-top:6px;border-top:1px solid #78947555}.mobile-system-app-nav span{display:flex;flex-direction:column;align-items:center;gap:1px;font-size:12px;color:#bdd2b7}.mobile-system-app-nav small{font-size:5px}.mobile-system-app-nav span:first-child{color:#d6f36e}.mobile-system-home{position:absolute;z-index:5;bottom:6px;left:35%;width:30%;height:3px;border-radius:5px;background:#a9c3a0}
.mobile-system-connect{position:absolute;z-index:2;right:0;top:80px;width:31%;padding:15px 12px;border:1px solid #b7cab2;border-radius:12px;background:#e8f0de;box-shadow:0 20px 35px -22px #1a3b2d69;transform:rotate(6deg);color:#253d30}.mobile-system-connect-icon{display:grid;place-items:center;width:33px;height:33px;border-radius:9px;background:#c5e399;color:#2d5d3a;font-size:20px}.mobile-system-connect>small{display:block;margin-top:13px;font-size:6px;font-weight:700;letter-spacing:.12em;color:#68866b}.mobile-system-connect>strong{display:block;margin-top:6px;font-size:15px;line-height:1.1;letter-spacing:-.045em}.mobile-system-connect>div:last-child{display:flex;align-items:center;gap:3px;margin-top:14px}.mobile-system-connect>div:last-child span{padding:5px 4px;border:1px solid #acc7a2;border-radius:5px;font-size:5px;font-weight:700}.mobile-system-connect>div:last-child i{flex:1;height:1px;background:#a9c69c}
.mobile-system-status{position:absolute;z-index:4;right:0;bottom:45px;width:30%;display:flex;gap:7px;align-items:center;padding:10px;border:1px solid #c4d2bb;border-radius:11px;background:#fbfcf6;box-shadow:0 13px 30px -18px #18382780;color:#294130;transform:rotate(4deg)}.mobile-system-status>i{display:grid;place-items:center;flex:0 0 23px;height:23px;border-radius:50%;background:#d7efb9;color:#3f7646;font-size:12px;font-style:normal}.mobile-system-status>span{display:flex;flex:1;flex-direction:column;gap:2px}.mobile-system-status small{font-size:5px;letter-spacing:.1em;color:#7a977b}.mobile-system-status strong{font-size:8px;white-space:nowrap}.mobile-system-status>b{font-size:5px;color:#8fa58d}
.mobile-system-caption{display:flex;align-items:center;gap:8px;justify-content:center;margin-top:1px;color:#7f927b;font-size:8px;letter-spacing:.13em;font-weight:650}.mobile-system-caption i{width:19px;height:1px;background:#b9c8b2}.mobile-system-caption small{margin-left:auto;color:#9ba99a;font-size:7px;letter-spacing:.1em}
@media(max-width:1100px){.mobile-software-page .commerce-hero.commerce-hero-showcase{min-height:410px}.mobile-system-stage{height:350px}.mobile-system-panel{top:67px;padding:11px 9px}.mobile-system-panel>strong{font-size:14px;margin-top:10px}.mobile-system-panel-stats{margin-top:8px}.mobile-system-panel-stats b{font-size:14px}.mobile-system-panel-chart{height:37px}.mobile-system-phone{border-radius:19px;padding:4px}.mobile-system-app{padding:18px 8px 8px}.mobile-system-app-top strong{font-size:14px}.mobile-system-greeting{margin-top:14px}.mobile-system-greeting strong{font-size:21px}.mobile-system-summary{margin-top:12px;padding:7px}.mobile-system-summary strong{font-size:22px}.mobile-system-app-label{margin-top:9px}.mobile-system-task{padding:6px 0}.mobile-system-task i{flex-basis:18px;height:18px}.mobile-system-connect{top:60px;padding:10px}.mobile-system-connect>strong{font-size:12px}.mobile-system-status{bottom:50px;padding:7px}.mobile-system-status>b{display:none}.mobile-system-caption small{display:none}}
@media(min-width:761px) and (max-width:900px){.mobile-software-page .commerce-first-row{grid-template-columns:1fr;gap:12px}.mobile-software-page .commerce-hero.commerce-hero-showcase{min-height:470px}.mobile-system-visual{max-width:660px}.mobile-system-stage{height:410px}.mobile-system-phone{aspect-ratio:.6}}
@media(max-width:760px){.mobile-software-page .commerce-hero.commerce-hero-showcase{min-height:370px;padding:15px 0 35px}.mobile-system-visual{max-width:570px}.mobile-system-stage{height:clamp(300px,72vw,460px)}}
@media(max-width:430px){.mobile-software-page .commerce-hero.commerce-hero-showcase{min-height:305px;padding:9px 0 31px}.mobile-system-stage{height:292px}.mobile-system-panel{left:0;top:65px;width:43%;padding:7px 6px;border-radius:7px}.mobile-system-panel-top{font-size:4px}.mobile-system-panel-top b{font-size:3px}.mobile-system-panel>strong{font-size:10px;margin-top:7px}.mobile-system-panel>small{font-size:4px}.mobile-system-panel-stats{gap:3px;margin-top:6px}.mobile-system-panel-stats span{padding:4px;font-size:4px}.mobile-system-panel-stats b{font-size:10px}.mobile-system-panel-chart{height:25px;margin:4px 0;padding:3px;gap:2px}.mobile-system-panel-row{padding:4px 0;font-size:4px}.mobile-system-panel-row b{font-size:4px}.mobile-system-phone{left:30%;top:9px;width:40%;padding:3px;border-radius:14px;box-shadow:0 21px 31px -18px #112d1d8c,0 0 0 3px #e8eee3}.mobile-system-notch{top:4px;height:6px}.mobile-system-app{padding:15px 6px 6px;border-radius:11px}.mobile-system-app-top strong{font-size:11px}.mobile-system-app-top>span{font-size:7px}.mobile-system-greeting{margin-top:15px}.mobile-system-greeting small{font-size:4px}.mobile-system-greeting strong{margin-top:5px;font-size:18px}.mobile-system-greeting>span{font-size:5px;margin-top:4px}.mobile-system-summary{margin-top:10px;padding:6px;border-radius:6px}.mobile-system-summary small{font-size:3px}.mobile-system-summary strong{font-size:18px}.mobile-system-summary strong span{font-size:7px}.mobile-system-summary>span{font-size:4px;margin-top:3px}.mobile-system-app-label{margin:8px 0 4px;font-size:3px}.mobile-system-task{gap:4px;padding:5px 0}.mobile-system-task i{flex-basis:15px;height:15px;font-size:7px}.mobile-system-task b{font-size:5px}.mobile-system-task small{font-size:3px}.mobile-system-task em{font-size:6px}.mobile-system-app-nav{padding-top:5px}.mobile-system-app-nav span{font-size:9px}.mobile-system-app-nav small{font-size:3px}.mobile-system-home{bottom:3px;height:2px}.mobile-system-connect{right:0;top:59px;width:40%;padding:7px 6px;border-radius:7px}.mobile-system-connect-icon{width:19px;height:19px;border-radius:5px;font-size:13px}.mobile-system-connect>small{font-size:4px;margin-top:8px}.mobile-system-connect>strong{font-size:9px;margin-top:4px}.mobile-system-connect>div:last-child{gap:2px;margin-top:8px}.mobile-system-connect>div:last-child span{font-size:3px;padding:3px 2px}.mobile-system-status{right:0;bottom:35px;width:38%;padding:5px 4px;gap:3px;border-radius:6px}.mobile-system-status>i{flex-basis:14px;height:14px;font-size:8px}.mobile-system-status small{font-size:3px}.mobile-system-status strong{font-size:5px}.mobile-system-caption{gap:5px;font-size:5px}.mobile-system-caption i{width:10px}}
@media(min-width:1101px){.mobile-system-greeting{margin-top:14px}.mobile-system-summary{margin-top:12px;padding:8px 10px}.mobile-system-app-label{margin:9px 0 3px}.mobile-system-task{padding:6px 0}}
@media(max-width:350px){.mobile-system-task+.mobile-system-task{display:none}}

/* Responsive UX: one visual language adapted across three device sizes. */
.responsive-ui-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:22px 0 46px}
.responsive-ui-page .commerce-hero-showcase:before{inset:5% -4%;background:radial-gradient(ellipse at 54% 53%,#d2dfc187,transparent 66%)}
.responsive-visual{position:relative;width:100%;max-width:760px;margin:auto;isolation:isolate}
.responsive-orbit{position:absolute;z-index:-1;inset:6% 1% 4%;border:1px solid #b7c8ae85;border-radius:50%;transform:rotate(-12deg) scaleY(.77)}.responsive-orbit i:first-child{position:absolute;inset:12% 9%;border:1px solid #bdcfb370;border-radius:50%}.responsive-orbit i:last-child{position:absolute;top:17%;right:8%;width:7px;height:7px;border-radius:50%;background:#a6c974;box-shadow:0 0 0 8px #a6c97425}
.responsive-stage{position:relative;height:405px}
.responsive-browser{position:absolute;left:0;top:16px;width:87%;overflow:hidden;border:1px solid #687d6b;border-radius:13px;background:#193323;box-shadow:0 25px 48px -25px #142f1f85,0 0 0 6px #e9eee5;color:#f8f9ee}.responsive-browser-bar{height:24px;display:flex;align-items:center;justify-content:space-between;padding:0 12px;background:#eaf0e7;color:#748a73}.responsive-browser-bar>span{display:flex;gap:3px}.responsive-browser-bar i{width:4px;height:4px;border-radius:50%;background:#a0b4a2}.responsive-browser-bar small{font-size:6px;letter-spacing:.13em;font-weight:700}.responsive-browser-bar b{font-size:12px;font-weight:400}
.responsive-browser-site{position:relative;overflow:hidden;padding:15px 18px 0;background:radial-gradient(circle at 82% 45%,#42684d 0,transparent 44%),#193323}.responsive-site-nav{display:flex;justify-content:space-between;align-items:center;padding-bottom:10px;border-bottom:1px solid #ffffff48}.responsive-site-nav strong{font-size:17px;font-weight:750;letter-spacing:-.09em}.responsive-site-nav strong span,.responsive-tablet-nav strong span,.responsive-phone-nav strong span{font-size:7px;vertical-align:top;letter-spacing:0}.responsive-site-nav>span{font-size:6px;color:#d2decf}.responsive-site-nav>b{display:none;font-size:7px}.responsive-site-main{display:grid;grid-template-columns:minmax(0,1fr) 135px;gap:8px;align-items:center;min-height:200px}.responsive-site-main>div:first-child{display:flex;flex-direction:column;align-items:flex-start}.responsive-site-main small{font-size:6px;letter-spacing:.14em;color:#c9e5a3}.responsive-site-main strong{margin-top:13px;font-size:28px;letter-spacing:-.065em;line-height:1.05}.responsive-site-main em,.responsive-tablet-site>strong em,.responsive-phone-site>strong em{font-style:normal;color:#d8f470}.responsive-site-main>div:first-child>span{max-width:200px;margin-top:9px;font-size:7px;line-height:1.5;color:#bdcfb9}.responsive-site-main>div:first-child>b{display:flex;gap:15px;align-items:center;margin-top:12px;padding:6px 10px;border:1px solid #a3bd9b;border-radius:18px;font-size:6px}.responsive-site-main>div:first-child>b i{font-size:9px;font-style:normal;color:#d8f470}.responsive-site-art{position:relative;height:150px}.responsive-site-art i{position:absolute;inset:5% 5%;border:1px solid #bddfa58c;border-radius:50%;transform:rotate(24deg) scaleX(.74)}.responsive-site-art i+i{inset:16% 16%;transform:rotate(-35deg) scaleX(.8)}.responsive-site-art span{position:absolute;inset:0;display:grid;place-items:center;font-size:50px;letter-spacing:-.12em;font-weight:800;color:#d8f470}.responsive-site-foot{display:flex;gap:20px;padding:9px 0;border-top:1px solid #ffffff2e;color:#a7c3a4;font-size:6px;letter-spacing:.11em}
.responsive-tablet{position:absolute;z-index:2;right:1%;top:121px;width:38%;aspect-ratio:.82;overflow:hidden;padding:5px;border:1px solid #768d77;border-radius:15px;background:linear-gradient(120deg,#a0b2a1,#e1e8db 45%,#8ea58f);box-shadow:0 20px 35px -20px #1b352782,0 0 0 5px #eaf0e6}.responsive-tablet-camera{position:absolute;left:48%;top:3px;width:4px;height:4px;border-radius:50%;background:#55725a}.responsive-tablet-site{display:flex;flex-direction:column;overflow:hidden;height:100%;padding:12px 10px 9px;border-radius:10px;background:#eef3e8;color:#263e2c}.responsive-tablet-nav{display:flex;justify-content:space-between;align-items:center;padding-bottom:7px;border-bottom:1px solid #cbd9c6}.responsive-tablet-nav strong{font-size:12px;letter-spacing:-.09em}.responsive-tablet-nav small{font-size:9px}.responsive-tablet-site>small{margin-top:17px;font-size:5px;letter-spacing:.13em;color:#6a8b62}.responsive-tablet-site>strong{margin-top:7px;font-size:17px;line-height:1.08;letter-spacing:-.06em}.responsive-tablet-site>strong em{color:#688e3d}.responsive-tablet-art{position:relative;align-self:flex-end;width:43%;height:55px;margin-top:-28px;border-radius:50%;background:#dcebbb}.responsive-tablet-art i{position:absolute;inset:7%;border:1px solid #84a467;border-radius:50%;transform:rotate(25deg) scaleX(.74)}.responsive-tablet-art span{position:absolute;inset:0;display:grid;place-items:center;font-size:19px;font-weight:800;color:#4f7542}.responsive-tablet-site>p{margin:9px 0 0;font-size:6px;color:#667b66}.responsive-tablet-cards{display:flex;gap:7px;margin-top:auto}.responsive-tablet-cards span{flex:1;height:36px;border-radius:6px;background:#d2e0cc}.responsive-tablet-cards span+span{background:#b9d392}.responsive-tablet-home{position:absolute;bottom:4px;left:40%;width:20%;height:2px;border-radius:5px;background:#617d65}
.responsive-phone{position:absolute;z-index:3;left:34%;top:188px;width:19%;aspect-ratio:.52;overflow:hidden;padding:4px;border:1px solid #647a66;border-radius:17px;background:linear-gradient(120deg,#a2b9a0,#e5ebdc 46%,#7e997e);box-shadow:0 17px 30px -16px #1c362789,0 0 0 4px #eaf0e7}.responsive-phone-notch{position:absolute;z-index:2;left:35%;top:5px;width:30%;height:6px;border-radius:0 0 6px 6px;background:#0a1a0f}.responsive-phone-site{display:flex;flex-direction:column;overflow:hidden;height:100%;padding:13px 6px 6px;border-radius:12px;background:#1d3726;color:#f6f8ed}.responsive-phone-nav{display:flex;justify-content:space-between;align-items:center}.responsive-phone-nav strong{font-size:9px;letter-spacing:-.09em}.responsive-phone-nav small{font-size:7px}.responsive-phone-site>small{margin-top:22px;font-size:4px;letter-spacing:.09em;color:#c4dba9}.responsive-phone-site>strong{margin-top:6px;font-size:13px;line-height:1.05;letter-spacing:-.06em}.responsive-phone-art{position:relative;width:100%;height:47px;margin-top:8px;border-radius:50%;background:#3e6248}.responsive-phone-art i{position:absolute;inset:8%;border:1px solid #a6d17e;border-radius:50%;transform:rotate(-21deg) scaleX(.72)}.responsive-phone-art span{position:absolute;inset:0;display:grid;place-items:center;font-size:17px;font-weight:800;color:#d8f470}.responsive-phone-site>p{margin:6px 0 0;font-size:4px;color:#c2d5bd}.responsive-phone-site>b{align-self:flex-start;margin-top:auto;padding:4px 6px;border:1px solid #a6bd9e;border-radius:10px;font-size:4px}.responsive-phone-home{position:absolute;bottom:3px;left:35%;width:30%;height:2px;border-radius:5px;background:#c4d3be}
.responsive-caption{display:flex;justify-content:center;align-items:center;gap:9px;color:#7b8e79;font-size:8px;font-weight:650;letter-spacing:.12em}.responsive-caption i{width:18px;height:1px;background:#b7c9b2}.responsive-caption small{margin-left:auto;color:#a0aea0;font-size:7px}
@media(max-width:1100px){.responsive-ui-page .commerce-hero.commerce-hero-showcase{min-height:410px}.responsive-stage{height:340px}.responsive-browser-site{padding:10px 12px 0}.responsive-site-main{min-height:158px;grid-template-columns:minmax(0,1fr) 65px}.responsive-site-main strong{font-size:21px}.responsive-site-art{height:80px}.responsive-site-art span{font-size:30px}.responsive-site-nav>span{display:none}.responsive-site-nav>b{display:block}.responsive-tablet{top:95px}.responsive-tablet-site{padding:10px 7px 7px}.responsive-tablet-site>small{margin-top:10px}.responsive-tablet-site>strong{font-size:12px}.responsive-tablet-art{height:35px;margin-top:-18px}.responsive-tablet-cards span{height:26px}.responsive-phone{top:155px}.responsive-phone-site>small{margin-top:15px}.responsive-phone-site>strong{font-size:10px}.responsive-phone-art{height:35px}}
@media(min-width:761px) and (max-width:900px){.responsive-ui-page .commerce-first-row{grid-template-columns:1fr;gap:14px}.responsive-ui-page .commerce-hero.commerce-hero-showcase{min-height:440px}.responsive-visual{max-width:660px}.responsive-stage{height:390px}.responsive-site-main{min-height:205px;grid-template-columns:minmax(0,1fr) 110px}.responsive-site-main strong{font-size:28px}.responsive-site-art{height:130px}.responsive-tablet{top:113px}.responsive-tablet-site>strong{font-size:17px}.responsive-phone{top:184px}.responsive-phone-site>strong{font-size:13px}}
@media(max-width:760px){.responsive-ui-page .commerce-hero.commerce-hero-showcase{min-height:350px;padding:15px 0 43px}.responsive-visual{max-width:600px}.responsive-stage{height:clamp(290px,59vw,390px)}}
@media(max-width:430px){.responsive-ui-page .commerce-hero.commerce-hero-showcase{min-height:300px;padding:10px 0 35px}.responsive-stage{height:280px}.responsive-browser{top:10px;border-radius:8px;box-shadow:0 17px 30px -17px #142f1f85,0 0 0 3px #e9eee5}.responsive-browser-bar{height:16px;padding:0 6px}.responsive-browser-bar i{width:3px;height:3px}.responsive-browser-bar small{font-size:4px}.responsive-browser-bar b{font-size:8px}.responsive-browser-site{padding:7px 8px 0}.responsive-site-nav{padding-bottom:5px}.responsive-site-nav strong{font-size:10px}.responsive-site-nav strong span{font-size:4px}.responsive-site-nav>b{font-size:4px}.responsive-site-main{min-height:120px;grid-template-columns:minmax(0,1fr) 46px}.responsive-site-main small{font-size:4px}.responsive-site-main strong{margin-top:7px;font-size:17px}.responsive-site-main>div:first-child>span{max-width:110px;margin-top:5px;font-size:4px}.responsive-site-main>div:first-child>b{font-size:4px;margin-top:7px;padding:4px 6px}.responsive-site-art{height:56px}.responsive-site-art span{font-size:19px}.responsive-site-foot{gap:8px;padding:5px 0;font-size:4px}.responsive-tablet{top:78px;width:39%;padding:3px;border-radius:9px;box-shadow:0 15px 24px -15px #1b352782,0 0 0 3px #eaf0e6}.responsive-tablet-site{padding:7px 5px 5px;border-radius:6px}.responsive-tablet-nav{padding-bottom:4px}.responsive-tablet-nav strong{font-size:7px}.responsive-tablet-nav strong span{font-size:3px}.responsive-tablet-nav small{font-size:6px}.responsive-tablet-site>small{font-size:3px;margin-top:8px}.responsive-tablet-site>strong{font-size:10px;margin-top:4px}.responsive-tablet-art{height:23px;margin-top:-10px}.responsive-tablet-art span{font-size:11px}.responsive-tablet-site>p{font-size:4px;margin-top:4px}.responsive-tablet-cards{gap:3px}.responsive-tablet-cards span{height:17px}.responsive-phone{left:32%;top:132px;width:21%;padding:2px;border-radius:10px;box-shadow:0 13px 22px -12px #1c362789,0 0 0 2px #eaf0e7}.responsive-phone-notch{top:2px;height:4px}.responsive-phone-site{padding:9px 4px 4px;border-radius:7px}.responsive-phone-nav strong{font-size:6px}.responsive-phone-nav strong span{font-size:3px}.responsive-phone-nav small{font-size:5px}.responsive-phone-site>small{font-size:3px;margin-top:11px}.responsive-phone-site>strong{font-size:8px;margin-top:4px}.responsive-phone-art{height:25px;margin-top:4px}.responsive-phone-art span{font-size:10px}.responsive-phone-site>p{font-size:3px;margin-top:3px}.responsive-phone-site>b{font-size:3px;padding:2px 3px}.responsive-phone-home{bottom:2px;height:1px}.responsive-caption{gap:5px;font-size:5px}.responsive-caption i{width:9px}.responsive-caption small{display:none}}

/* Otel fotoğraf çekimi: gerçek referanslardan ayrı tutulan temsili görsel vitrin. */
.hotel-photo-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:18px 0 32px;overflow:visible}
.hotel-photo-page .commerce-hero-showcase:before{inset:7% -4%;background:radial-gradient(ellipse at 53% 53%,#d8decdab,transparent 70%)}
.hotel-photo-visual{position:relative;width:100%;max-width:690px;height:440px;margin:auto}
.hotel-photo-visual-index{position:absolute;z-index:2;top:8px;left:2%;font-size:10px;font-weight:750;letter-spacing:.23em;color:#647352}
.hotel-photo-visual-main,.hotel-photo-visual-detail{position:absolute;overflow:hidden;border:5px solid #f4f5f0;background:#d7d9ce;box-shadow:0 28px 50px -29px #182a1c99,0 0 0 1px #c7d0bf;transform:translateY(12px);opacity:0;animation:hotel-photo-arrive .9s .15s cubic-bezier(.2,.8,.2,1) forwards}
.hotel-photo-visual-main{left:2%;top:39px;width:78%;height:345px;border-radius:20px}
.hotel-photo-visual-detail{z-index:1;right:1%;bottom:8px;width:42%;height:255px;border-radius:17px;animation-delay:.35s}
.hotel-photo-visual img,.hotel-photo-gallery-card img{display:block;width:100%;height:100%;object-fit:cover}
.hotel-photo-visual-main img{object-position:center}
.hotel-photo-visual-detail img{object-position:58% center}
.hotel-photo-visual-main:after,.hotel-photo-visual-detail:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#0b211d8c);pointer-events:none}
.hotel-photo-visual-main span,.hotel-photo-visual-detail span{position:absolute;z-index:1;left:22px;bottom:19px;color:#fff;font-size:10px;font-weight:750;letter-spacing:.16em}
.hotel-photo-visual-detail span{left:13px;bottom:13px;font-size:8px}
.hotel-photo-visual-note{position:absolute;bottom:7px;left:2%;font-size:9px;font-weight:700;letter-spacing:.14em;color:#7a8872}
@keyframes hotel-photo-arrive{to{transform:translateY(0);opacity:1}}
.hotel-photo-gallery{background:#eff1eb}
.hotel-photo-gallery-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:22px}
.hotel-photo-gallery-card{position:relative;min-width:0;overflow:hidden;aspect-ratio:1.22;border-radius:18px;margin:0;background:#d9dfd1}
.hotel-photo-gallery-card-wide{aspect-ratio:1.75}
.hotel-photo-gallery-card img{transition:transform .9s cubic-bezier(.2,.75,.2,1)}
.hotel-photo-gallery-card:hover img{transform:scale(1.04)}
.hotel-photo-gallery-card:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#10241da8)}
.hotel-photo-gallery-card figcaption{position:absolute;z-index:1;left:28px;right:20px;bottom:26px;display:grid;gap:8px;color:#fff}
.hotel-photo-gallery-card figcaption span{font-size:10px;font-weight:750;letter-spacing:.16em}
.hotel-photo-gallery-card figcaption strong{font-size:clamp(22px,2.1vw,34px);line-height:1.13;letter-spacing:-.04em}
.hotel-photo-gallery-foot{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:23px;color:#7b8975;font-size:12px}
.hotel-photo-gallery-foot a{display:inline-flex;gap:18px;align-items:center;color:#273728;text-decoration:none;font-weight:700;border-bottom:1px solid #708963;padding-bottom:7px}
.hotel-photo-gallery-foot a:hover{color:#587a36}
@media(max-width:1100px){.hotel-photo-page .commerce-hero.commerce-hero-showcase{min-height:395px}.hotel-photo-visual{height:375px}.hotel-photo-visual-main{top:35px;height:290px}.hotel-photo-visual-detail{height:220px}}
@media(max-width:760px){.hotel-photo-page .commerce-hero.commerce-hero-showcase{min-height:380px;padding:12px 0 30px}.hotel-photo-visual{height:365px;max-width:600px}.hotel-photo-visual-main{height:300px}.hotel-photo-visual-detail{height:220px}.hotel-photo-gallery-grid{grid-template-columns:1fr}.hotel-photo-gallery-card,.hotel-photo-gallery-card-wide{aspect-ratio:1.65}}
@media(max-width:430px){.hotel-photo-page .commerce-hero.commerce-hero-showcase{min-height:300px;padding:8px 0 20px}.hotel-photo-visual{height:285px}.hotel-photo-visual-index{font-size:7px}.hotel-photo-visual-main{top:25px;height:220px;border-width:3px;border-radius:13px}.hotel-photo-visual-detail{height:155px;border-width:3px;border-radius:11px}.hotel-photo-visual-main span{left:11px;bottom:10px;font-size:7px}.hotel-photo-visual-detail span{left:8px;bottom:8px;font-size:6px}.hotel-photo-visual-note{font-size:7px}.hotel-photo-gallery-grid{gap:13px}.hotel-photo-gallery-card,.hotel-photo-gallery-card-wide{aspect-ratio:1.35;border-radius:12px}.hotel-photo-gallery-card figcaption{left:17px;bottom:17px}.hotel-photo-gallery-card figcaption span{font-size:8px}.hotel-photo-gallery-card figcaption strong{font-size:22px}.hotel-photo-gallery-foot{font-size:10px}}
@media(prefers-reduced-motion:reduce){.hotel-photo-visual-main,.hotel-photo-visual-detail{animation:none;transform:none;opacity:1}.hotel-photo-gallery-card img{transition:none}}


/* 360° sanal tur hizmeti için temsili panoramik sahne vitrini. */
.virtual-tour-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:18px 0 35px;overflow:visible}
.virtual-tour-page .commerce-hero-showcase:before{inset:2% -5%;background:radial-gradient(ellipse at 50% 48%,#d6e0d2ab,transparent 70%)}
.virtual-tour-visual{position:relative;width:100%;max-width:700px;height:420px;margin:auto}
.virtual-tour-visual-index{position:absolute;top:10px;left:2%;font-size:10px;font-weight:750;letter-spacing:.19em;color:#718067}
.virtual-tour-frame{position:absolute;top:42px;left:2%;width:96%;height:310px;overflow:hidden;border:6px solid #f4f6f1;border-radius:18px;background:#788474;box-shadow:0 26px 55px -30px #1f372d9e,0 0 0 1px #c9d3c6;opacity:0;transform:translateY(15px);animation:hotel-photo-arrive .9s .15s cubic-bezier(.2,.8,.2,1) forwards}
.virtual-tour-frame>img,.virtual-tour-detail>img,.virtual-tour-gallery-card img{display:block;width:100%;height:100%;object-fit:cover}.virtual-tour-frame>img{object-position:center}
.virtual-tour-frame-shade{position:absolute;inset:40% 0 0;background:linear-gradient(transparent,#12261d98)}
.virtual-tour-frame-label,.virtual-tour-frame-bottom{position:absolute;z-index:1;left:22px;color:#fff;font-size:10px;font-weight:750;letter-spacing:.15em}.virtual-tour-frame-label{top:20px}.virtual-tour-frame-bottom{bottom:22px;display:flex;align-items:center;gap:12px}.virtual-tour-frame-bottom i{display:grid;place-items:center;width:24px;height:24px;border:1px solid #ffffff99;border-radius:50%;font-style:normal;font-size:14px}
.virtual-tour-frame-ring{position:absolute;z-index:1;left:50%;top:50%;display:grid;place-items:center;width:92px;height:92px;border:1px solid #ffffffb5;border-radius:50%;background:#142a2080;color:#fff;transform:translate(-50%,-50%);box-shadow:0 0 0 12px #ffffff20,0 0 0 24px #ffffff12;backdrop-filter:blur(6px)}
.virtual-tour-frame-ring:before,.virtual-tour-frame-ring:after{content:'';position:absolute;width:115%;height:48%;border:1px solid #ffffffa0;border-radius:50%;transform:rotate(18deg)}.virtual-tour-frame-ring:after{transform:rotate(-53deg);opacity:.6}.virtual-tour-frame-ring b{font-size:26px;letter-spacing:-.06em;font-weight:700}
.virtual-tour-detail{position:absolute;z-index:2;right:0;bottom:10px;width:42%;height:155px;overflow:hidden;border:5px solid #f4f6f1;border-radius:15px;background:#8e907f;box-shadow:0 20px 35px -20px #173023b3;opacity:0;transform:translateY(15px);animation:hotel-photo-arrive .9s .36s cubic-bezier(.2,.8,.2,1) forwards}.virtual-tour-detail:after{content:'';position:absolute;inset:55% 0 0;background:linear-gradient(transparent,#14281fab)}.virtual-tour-detail span{position:absolute;z-index:1;left:14px;bottom:13px;font-size:9px;font-weight:750;letter-spacing:.15em;color:white}
.virtual-tour-visual-note{position:absolute;bottom:12px;left:2%;font-size:9px;font-weight:700;letter-spacing:.13em;color:#7a8777}
.virtual-tour-gallery{background:#eff2ed}.virtual-tour-gallery-grid{display:grid;grid-template-columns:1fr 1fr;gap:22px}.virtual-tour-gallery-card{position:relative;overflow:hidden;min-width:0;margin:0;aspect-ratio:1.8;border-radius:17px;background:#d7ded3}.virtual-tour-gallery-card img{transition:transform .9s cubic-bezier(.2,.8,.2,1)}.virtual-tour-gallery-card:hover img{transform:scale(1.04)}.virtual-tour-gallery-card:after{content:'';position:absolute;inset:45% 0 0;background:linear-gradient(transparent,#12261caf)}.virtual-tour-gallery-card figcaption{position:absolute;z-index:1;left:25px;right:15px;bottom:23px;display:grid;gap:8px;color:#fff}.virtual-tour-gallery-card figcaption span{font-size:10px;font-weight:750;letter-spacing:.15em}.virtual-tour-gallery-card figcaption strong{font-size:clamp(22px,2.2vw,32px);line-height:1.1;letter-spacing:-.04em}
@media(max-width:1100px){.virtual-tour-page .commerce-hero.commerce-hero-showcase{min-height:400px}.virtual-tour-visual{height:360px}.virtual-tour-frame{height:265px}.virtual-tour-detail{height:135px}}
@media(max-width:760px){.virtual-tour-page .commerce-hero.commerce-hero-showcase{min-height:365px;padding:12px 0 25px}.virtual-tour-visual{height:340px;max-width:610px}.virtual-tour-frame{height:265px}.virtual-tour-gallery-grid{grid-template-columns:1fr}.virtual-tour-gallery-card{aspect-ratio:1.75}}
@media(max-width:430px){.virtual-tour-page .commerce-hero.commerce-hero-showcase{min-height:295px;padding:10px 0 20px}.virtual-tour-visual{height:285px}.virtual-tour-visual-index{font-size:7px}.virtual-tour-frame{top:29px;height:216px;border-width:3px;border-radius:12px}.virtual-tour-frame-label,.virtual-tour-frame-bottom{left:10px;font-size:7px}.virtual-tour-frame-label{top:11px}.virtual-tour-frame-bottom{bottom:11px}.virtual-tour-frame-bottom i{width:18px;height:18px;font-size:11px}.virtual-tour-frame-ring{width:58px;height:58px;box-shadow:0 0 0 8px #ffffff20,0 0 0 16px #ffffff12}.virtual-tour-frame-ring b{font-size:18px}.virtual-tour-detail{height:105px;border-width:3px;border-radius:9px;bottom:16px}.virtual-tour-detail span{left:7px;bottom:6px;font-size:6px}.virtual-tour-visual-note{bottom:13px;font-size:7px}.virtual-tour-gallery-grid{gap:13px}.virtual-tour-gallery-card{aspect-ratio:1.42;border-radius:12px}.virtual-tour-gallery-card figcaption{left:16px;bottom:14px}.virtual-tour-gallery-card figcaption span{font-size:8px}.virtual-tour-gallery-card figcaption strong{font-size:23px}}
@media(prefers-reduced-motion:reduce){.virtual-tour-frame,.virtual-tour-detail{animation:none;opacity:1;transform:none}.virtual-tour-gallery-card img{transition:none}}


/* Otel tanıtım filmi: oynatılabilir video iddiası taşımayan sinematik kare vitrini. */
.hotel-film-page .commerce-hero.commerce-hero-showcase{display:flex;align-items:center;min-height:490px;padding:20px 0 34px;overflow:visible}
.hotel-film-page .commerce-hero-showcase:before{inset:5% -5%;background:radial-gradient(ellipse at 53% 52%,#d1d7c99c,transparent 70%)}
.hotel-film-visual{position:relative;width:100%;max-width:720px;height:430px;margin:auto}
.hotel-film-visual-index{position:absolute;left:2%;top:6px;color:#6c7b65;font-size:10px;font-weight:750;letter-spacing:.2em}
.hotel-film-frame,.hotel-film-detail{position:absolute;overflow:hidden;border:5px solid #f3f5ef;background:#273426;box-shadow:0 25px 55px -29px #13251e9e,0 0 0 1px #c9d2c4;opacity:0;transform:translateY(16px);animation:hotel-photo-arrive .9s .15s cubic-bezier(.2,.8,.2,1) forwards}
.hotel-film-frame{left:2%;top:40px;width:94%;height:305px;border-radius:17px}
.hotel-film-frame img,.hotel-film-detail img{display:block;width:100%;height:100%;object-fit:cover}
.hotel-film-frame img{object-position:center}
.hotel-film-frame-shade{position:absolute;inset:43% 0 0;background:linear-gradient(transparent,#0c1a21c7)}
.hotel-film-frame-label,.hotel-film-frame-caption,.hotel-film-frame-time{position:absolute;z-index:1;color:#fff}.hotel-film-frame-label{left:21px;top:19px;font-size:9px;font-weight:750;letter-spacing:.17em}.hotel-film-frame-caption{left:22px;bottom:31px;max-width:58%;font-size:clamp(19px,2vw,29px);font-weight:700;letter-spacing:-.05em;line-height:1.15}.hotel-film-frame-time{right:19px;bottom:25px;font-size:9px;font-weight:750;letter-spacing:.12em}
.hotel-film-detail{z-index:2;right:0;bottom:13px;width:40%;height:163px;border-radius:14px;animation-delay:.34s}.hotel-film-detail:after{content:'';position:absolute;inset:50% 0 0;background:linear-gradient(transparent,#0b1d20af)}.hotel-film-detail span{position:absolute;z-index:1;left:14px;bottom:12px;color:#fff;font-size:8px;font-weight:750;letter-spacing:.15em}
.hotel-film-visual-note{position:absolute;left:2%;bottom:16px;font-size:9px;font-weight:700;letter-spacing:.14em;color:#778774}
@media(max-width:1100px){.hotel-film-page .commerce-hero.commerce-hero-showcase{min-height:390px}.hotel-film-visual{height:360px}.hotel-film-frame{height:260px}.hotel-film-detail{height:137px}}
@media(max-width:760px){.hotel-film-page .commerce-hero.commerce-hero-showcase{min-height:365px;padding:14px 0 25px}.hotel-film-visual{height:340px;max-width:620px}.hotel-film-frame{height:255px}.hotel-film-detail{height:135px}}
@media(max-width:430px){.hotel-film-page .commerce-hero.commerce-hero-showcase{min-height:295px;padding:10px 0 20px}.hotel-film-visual{height:285px}.hotel-film-visual-index{font-size:7px}.hotel-film-frame{top:27px;height:213px;border-width:3px;border-radius:12px}.hotel-film-frame-label{left:10px;top:10px;font-size:7px}.hotel-film-frame-caption{left:11px;bottom:16px;font-size:17px;max-width:52%}.hotel-film-frame-time{right:10px;bottom:13px;font-size:6px}.hotel-film-detail{height:104px;bottom:16px;border-width:3px;border-radius:9px}.hotel-film-detail span{left:7px;bottom:7px;font-size:6px}.hotel-film-visual-note{bottom:14px;font-size:7px}}
@media(prefers-reduced-motion:reduce){.hotel-film-frame,.hotel-film-detail{animation:none;opacity:1;transform:none}}

