.smart-pos-page { --smart-green:#1f6a4b; --smart-green-dark:#123f30; --smart-mint:#e7f3ea; --smart-cream:#fff9ee; }
.smart-pos-page .smart-hero { background:radial-gradient(circle at 90% 18%,#d6ecdc 0,transparent 44%),linear-gradient(135deg,#fffdf8 0%,#f5faf5 100%); }
.smart-hero-visual { position:relative; min-height:540px; padding:34px 0 18px; }
.smart-phone { position:absolute; z-index:2; left:0; top:22px; width:245px; box-sizing:border-box; padding:12px; border:7px solid #17352a; border-radius:32px; background:#fff; box-shadow:0 28px 55px #17352a26; transform:rotate(-2deg); }
.smart-phone::before { content:""; display:block; width:72px; height:5px; margin:-4px auto 10px; border-radius:10px; background:#17352a; }
.smart-phone-bar,.smart-screen-head { display:flex; align-items:center; justify-content:space-between; gap:8px; }
.smart-phone-bar { color:#63756b; font-size:8px; }.smart-phone-bar b { color:var(--smart-green-dark); font-size:11px; }
.smart-phone-copy { padding:18px 3px 12px; }.smart-phone-copy small,.smart-screen-head small,.smart-motion small,.smart-ops-preview small { display:block; color:#6c7d73; font-size:8px; font-weight:750; letter-spacing:.11em; }.smart-phone-copy strong { display:block; margin-top:4px; color:#18382b; font-size:18px; }
.smart-dish { display:grid; grid-template-columns:44px 1fr 28px; align-items:center; gap:9px; margin-bottom:9px; padding:9px; border:1px solid #dbe7de; border-radius:13px; background:#fff; }.smart-dish-photo { width:44px; height:44px; border-radius:10px; background:radial-gradient(circle at 42% 45%,#e89a53 0 18%,#f4d084 19% 32%,#6c9a55 33% 38%,#eed9ae 39%); }.smart-dish-photo.dish-two { background:radial-gradient(circle at 55% 40%,#c64030 0 8%,#76a94e 9% 14%,#f4c66e 15% 42%,#c88643 43%); }.smart-dish strong,.smart-dish small { display:block; }.smart-dish strong { color:#19382b; font-size:10px; }.smart-dish small { margin-top:4px; color:#718078; font-size:8px; }.smart-dish button { display:grid; width:28px; height:28px; padding:0; place-items:center; border:0; border-radius:8px; background:var(--smart-green); color:white; }
.smart-cart-pill { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:13px; padding:12px; border-radius:12px; background:var(--smart-green); color:#fff; font-size:9px; }.smart-cart-pill strong { font-size:10px; }
.smart-pos-screen { position:absolute; right:0; bottom:18px; width:min(430px,72%); box-sizing:border-box; padding:22px; border:1px solid #ccdbd0; border-radius:22px; background:white; box-shadow:0 25px 60px #17352a1c; }.smart-screen-head { margin-bottom:17px; }.smart-screen-head strong { display:block; margin-top:4px; font-size:20px; color:#17352a; }.smart-screen-head > span { padding:6px 9px; border-radius:30px; background:var(--smart-mint); color:var(--smart-green); font-size:9px; font-weight:750; }
.smart-pos-screen article { display:flex; justify-content:space-between; gap:12px; margin-bottom:9px; padding:13px; border:1px solid #dce7df; border-radius:12px; }.smart-pos-screen article.is-new { border-color:#83b797; background:#f0f8f1; }.smart-pos-screen article small,.smart-pos-screen article strong { display:block; }.smart-pos-screen article small { color:#708077; font-size:8px; }.smart-pos-screen article strong { margin-top:4px; color:#18382b; font-size:11px; }.smart-pos-screen article b { color:var(--smart-green); font-size:10px; }
.smart-order-lines { margin-top:16px; padding:14px; border-radius:14px; background:#f4f7f3; }.smart-order-lines p { display:flex; justify-content:space-between; gap:8px; margin:0; padding:6px 0; color:#40564b; font-size:10px; line-height:1.4; }.smart-order-lines button { width:100%; margin-top:10px; padding:10px; border:0; border-radius:8px; background:var(--smart-green); color:#fff; font-size:10px; font-weight:750; }
.smart-sync-chip { position:absolute; z-index:3; left:166px; top:238px; display:flex; align-items:center; gap:8px; padding:10px 12px; border-radius:40px; background:#17352a; color:#fff; box-shadow:0 10px 28px #17352a30; font-size:9px; }.smart-sync-chip b { display:grid; width:18px; height:18px; place-items:center; border-radius:50%; background:#72bd83; }
.smart-motion { position:relative; display:grid; gap:11px; padding:28px; border:1px solid var(--pos-border); border-radius:26px; background:#f7faf5; overflow:hidden; }.smart-motion article { position:relative; z-index:1; display:grid; grid-template-columns:46px 1fr; gap:13px; align-items:center; padding:14px; border:1px solid #dce7df; border-radius:15px; background:#fff; }.smart-stage-icon { display:grid; width:42px; height:42px; place-items:center; border-radius:12px; background:var(--smart-mint); color:var(--smart-green); font-size:11px; font-weight:800; }.smart-motion strong { display:block; margin:3px 0; font-size:14px; }.smart-motion p { margin:0; font-size:11px; line-height:1.45; }.smart-motion-track { position:absolute; left:48px; top:55px; bottom:55px; width:2px; background:#cfe0d3; }.smart-motion-track span { position:absolute; left:-4px; width:10px; height:10px; border-radius:50%; background:var(--smart-green); box-shadow:0 0 0 5px #dfeee2; }
.smart-feature-pair > article:first-child { background:#e6f2e8; }.smart-feature-pair > article:nth-child(2) { background:#f8eee0; }
.smart-guest-preview,.smart-ops-preview { min-height:230px; box-sizing:border-box; margin-top:25px; padding:20px; border-radius:18px; background:#fff; }.smart-guest-preview { display:flex; align-items:center; gap:24px; }.smart-mini-phone { width:min(230px,75%); padding:16px; border:4px solid #1b382d; border-radius:20px; }.smart-mini-phone small,.smart-mini-phone strong { display:block; }.smart-mini-phone strong { margin:5px 0 10px; }.smart-mini-phone p { display:flex; justify-content:space-between; margin:0; padding:7px 0; border-bottom:1px solid #e2e9e2; font-size:10px; line-height:1.4; }.smart-mini-phone button { width:100%; margin-top:12px; padding:10px; border:0; border-radius:8px; background:var(--smart-green); color:#fff; font-size:9px; }.smart-choice-tags { display:grid; gap:10px; }.smart-choice-tags span { padding:7px 10px; border-radius:20px; background:var(--smart-mint); color:var(--smart-green); font-size:10px; font-weight:750; }
.smart-ops-preview { display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:14px; }.smart-ops-column,.smart-ticket { min-width:0; padding:17px; border:1px solid #dbe6dc; border-radius:14px; }.smart-ops-column strong,.smart-ops-column span,.smart-ticket strong { display:block; }.smart-ops-column strong,.smart-ticket strong { margin:7px 0; color:#18382b; }.smart-ops-column span,.smart-ticket p { color:#687a6f; font-size:10px; line-height:1.6; }.smart-ops-arrow { color:var(--smart-green); font-size:24px; }.smart-ticket { border-style:dashed; background:#fbfcf8; }
@media (min-width:601px) { .smart-benefits { grid-template-columns:repeat(2,minmax(0,1fr)); } }
.smart-benefits .smart-benefit-icon { display:grid; width:48px; height:48px; place-items:center; border:1px solid #cfe2d4; border-radius:14px; background:var(--smart-mint); color:var(--smart-green); }
.smart-benefits .smart-benefit-icon svg { width:27px; height:27px; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; }
.smart-steps { grid-template-columns:repeat(4,minmax(0,1fr)); }
.smart-businesses { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }.smart-businesses article { overflow:hidden; border:1px solid var(--pos-border); border-radius:20px; background:#fff; }.smart-business-photo { height:190px; overflow:hidden; }.smart-business-photo img { width:100%; height:100%; object-fit:cover; transition:transform .35s ease; }.smart-businesses article:hover img { transform:scale(1.035); }.smart-businesses .cafe img { object-position:15% 60%; }.smart-businesses .family img { object-position:42% 55%; }.smart-businesses .lounge img { object-position:70% 58%; }.smart-businesses .busy img { object-position:92% 55%; }.smart-businesses article > div:last-child { padding:22px; }.smart-businesses h3 { font-size:18px; }.smart-businesses p { margin:0; font-size:13px; }
.smart-final-actions { justify-content:center; }.smart-enquiry .pos-split { margin-top:34px; }.smart-enquiry-copy { padding:30px; border:1px solid #cbdccc; border-radius:24px; background:#f5faf5; }.smart-enquiry-copy h3 { margin-top:15px; font-size:27px; }.smart-enquiry-flow { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:30px; padding:18px; border-radius:16px; background:#fff; }.smart-enquiry-flow span { padding:8px 11px; border-radius:20px; background:var(--smart-mint); color:var(--smart-green); font-size:11px; font-weight:800; }.smart-enquiry-flow b { color:var(--smart-green); }
@media(prefers-reduced-motion:no-preference) { .smart-motion-track span { animation:smart-order-flow 5.2s ease-in-out infinite; } .smart-sync-chip { animation:smart-chip-float 3.4s ease-in-out infinite; } }
@keyframes smart-order-flow { 0% { top:0; } 75%,100% { top:calc(100% - 10px); } }
@keyframes smart-chip-float { 50% { transform:translateY(-6px); } }
@media(max-width:1100px) { .smart-phone { width:225px; }.smart-pos-screen { width:68%; }.smart-businesses { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:980px) { .smart-hero-visual { width:min(680px,100%); margin-inline:auto; }.smart-steps { grid-template-columns:1fr; }.smart-steps li { text-align:left; }.smart-pos-page .smart-hero { padding-bottom:52px; } }
@media(max-width:640px) { .smart-hero-visual { min-height:550px; padding-top:0; }.smart-phone { left:0; top:0; width:58%; }.smart-pos-screen { right:0; bottom:0; width:75%; padding:15px; }.smart-sync-chip { left:41%; top:230px; }.smart-order-lines { padding:10px; }.smart-motion { padding:18px 14px; }.smart-motion article { grid-template-columns:40px 1fr; padding:12px; }.smart-stage-icon { width:38px; height:38px; }.smart-motion-track { left:34px; }.smart-guest-preview { align-items:stretch; flex-direction:column; }.smart-mini-phone { width:100%; box-sizing:border-box; }.smart-choice-tags { grid-template-columns:repeat(3,1fr); }.smart-ops-preview { grid-template-columns:1fr; }.smart-ops-arrow { transform:rotate(90deg); text-align:center; }.smart-businesses { grid-template-columns:1fr; }.smart-business-photo { height:210px; }.smart-enquiry-copy { padding:22px; }.smart-enquiry-flow { padding:13px 10px; }.smart-enquiry-flow span { padding-inline:8px; }.smart-pos-page h1 { font-size:clamp(32px,10vw,44px); } }
@media(max-width:390px) { .smart-hero-visual { min-height:515px; }.smart-phone { width:64%; }.smart-pos-screen { width:79%; }.smart-sync-chip { left:35%; top:218px; }.smart-screen-head strong { font-size:16px; }.smart-pos-screen article:nth-of-type(2),.smart-order-lines p:nth-child(2) { display:none; }.smart-choice-tags { gap:5px; }.smart-choice-tags span { padding-inline:6px; }.smart-enquiry-flow span { font-size:9px; } }


/* Keep the enquiry illustration and form aligned in the same desktop row. */
.smart-enquiry .pos-split { align-items:stretch; }
.smart-enquiry-copy { display:flex; flex-direction:column; min-width:0; }
.smart-enquiry-copy > .eyebrow { margin-bottom:0; }
.smart-enquiry-copy > .check-list { margin-bottom:24px; }
.smart-enquiry-map { flex:1; padding:22px; border:1px solid #d8e6db; border-radius:18px; background:#fff; }
.smart-enquiry-map-heading h4 { margin:0 0 8px; font-size:19px; line-height:1.4; color:#17352a; }
.smart-enquiry-map-heading > span { font-size:12px; color:#52665a; }
.smart-enquiry-stages { list-style:none; padding:0; margin:24px 0 0; display:grid; gap:22px; }
.smart-enquiry-stages li { display:grid; grid-template-columns:38px minmax(0,1fr); gap:14px; position:relative; }
.smart-enquiry-stages li:not(:last-child)::after { content:''; position:absolute; left:18px; top:46px; bottom:-14px; width:2px; background:#dbe9df; }
.smart-enquiry-step { display:grid; place-items:center; width:38px; height:38px; border-radius:12px; background:#e7f3ea; color:#1f6a4b; font-size:13px; font-weight:750; }
.smart-enquiry-stages strong { display:block; font-size:16px; line-height:1.4; color:#17352a; }
.smart-pos-page .smart-enquiry-stages p { font-size:15px; line-height:1.6; color:#34443b; margin:7px 0 10px; }
.smart-enquiry-stage-tag { display:inline-block; padding:5px 9px; border-radius:8px; background:#f1f6f2; font-size:11px; color:#245c45; font-weight:650; }
.smart-enquiry-copy .smart-enquiry-flow { margin-top:24px; flex-shrink:0; }
@media(max-width:980px) { .smart-enquiry-map { flex:initial; } }
@media(max-width:600px) { .smart-enquiry-map { padding:18px 14px; }.smart-enquiry-stages li { gap:10px; }.smart-enquiry-map-heading h4 { font-size:18px; } }