.marketing-pos-devices { color:#0a1a33; background:#fff; font:400 18px/1.3 'Hanken Grotesk',sans-serif; }
.marketing-pos-devices *, .marketing-pos-devices *::before, .marketing-pos-devices *::after { box-sizing:border-box; }
.marketing-pos-devices :is(h1,h2,h3,p,figure) { margin:0; }
.marketing-pos-devices :is(h1,h2,h3) { font-family:Archivo,sans-serif; font-weight:700; letter-spacing:0; }
.marketing-pos-devices h1 { font-size:80px; line-height:1.04; max-width:1020px; color:white; }
.marketing-pos-devices h2 { font-size:48px; line-height:1.05; color:#0a1a33; }
.marketing-pos-devices h3 { font-size:22px; line-height:1.25; }
.pd-container { width:min(1200px,calc(100% - 64px)); margin-inline:auto; }
.pd-section { padding:84px 0; }
.pd-gray { background:#f4f6f8; }
.pd-navy { background:#0a1a33; color:white; }
.pd-navy h2,.pd-navy h3 { color:white; }
.marketing-pos-devices .pd-eyebrow { color:#007985; font:800 12px/1.35 'JetBrains Mono',monospace; letter-spacing:2px; margin:0 0 22px; text-transform:uppercase; }
.pd-navy .pd-eyebrow { color:#dcf1ef; }
.pd-center { text-align:center; }
.pd-center > p:not(.pd-eyebrow) { margin:24px auto 0; max-width:1120px; }
.pd-grid { display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:center; }
.pd-grid > * { min-width:0; }
.pd-grid h2 + p { margin-top:24px; }
.pd-right-copy > :last-child { text-align:right; }
.pd-hero { position:relative; overflow:hidden; isolation:isolate; padding:158px 0; color:white; background:#0a1a33 url('/assets/pos-devices/hero/hero-poster.jpg') center/cover; }
.pd-hero-video { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center; z-index:0; }
.pd-hero::before { content:''; position:absolute; inset:0; background:linear-gradient(90deg,#0a1a33d9,#0a1a33b8); z-index:1; pointer-events:none; }
.pd-hero > .pd-container { position:relative; z-index:2; }
.pd-static-hero .pd-hero-video { display:none; }
@media(max-width:800px) { .pd-hero { background-image:url('/assets/pos-devices/hero/hero-poster-mobile.jpg'); } }
@media(prefers-reduced-motion:reduce) { .pd-hero-video { display:none; } }
.pd-hero .pd-eyebrow { color:#dcf1ef; }
.pd-hero .pd-container > p:not(.pd-eyebrow) { margin-top:36px; max-width:640px; }
.pd-actions { display:flex; flex-wrap:wrap; gap:16px; align-items:center; margin-top:36px; }
.pd-button { display:inline-flex; align-items:center; justify-content:center; gap:12px; padding:12px 24px; min-height:48px; max-width:100%; border:1px solid #ffbf2e; border-radius:10px; background:#ffbf2e; color:#0a1a33; font:600 16px/22px 'Hanken Grotesk',sans-serif; text-decoration:none; text-align:center; }
.pd-button span { font-size:20px; }
.pd-secondary { background:#0a1a33; border-color:#0a1a33; color:white; }
.pd-outline { border-color:currentColor; background:transparent; color:inherit; }
.marketing-pos-devices nav.pd-section-nav { display:flex; flex-direction:row; flex-wrap:wrap; align-items:center; justify-content:center; position:static; width:auto; max-width:none; gap:24px; padding:22px 32px; background:white; box-shadow:none; border-bottom:1px solid #dde3eb; font-size:16px; }
.pd-section-nav a { padding:0; margin:0; color:#0a1a33; }
.pd-section-nav a:first-child { color:#007985; }
.pd-detail { display:block; color:#007985; margin-top:24px; font-size:14px; text-align:center; }
.pd-grid .pd-detail { text-align:inherit; }
.pd-navy .pd-detail { color:#79c5c1; }
.pd-platform-image { display:block; width:calc(100% + 180px); max-width:calc(100vw - 32px); height:auto; margin:64px auto 0; position:relative; left:50%; transform:translateX(-50%); }
.marketing-pos-devices .pd-caption { font-size:12px; line-height:1.4; font-style:italic; color:#57657a; margin-top:24px; text-align:center; }
.pd-cards { display:grid; gap:24px; margin-top:60px; }
.pd-cards > div { min-width:0; }
.pd-cards h3 { margin:14px 0; }
.pd-cards p { font-size:16px; line-height:1.4; color:#455e78; }
.pd-platform-cards { grid-template-columns:repeat(4,1fr); }
.pd-icon { display:inline-grid; place-items:center; width:64px; height:64px; border-radius:16px; background:#dcf1ef; color:#007985; flex:none; }
.pd-icon svg { width:32px; height:32px; }
.pd-section:not(.pd-gray):not(.pd-navy) > .pd-container > .pd-actions { justify-content:center; }
.pd-photo { display:block; width:100%; height:auto; border-radius:24px; }
.pd-checks { list-style:none; padding:0; margin:24px 0 0; }
.pd-checks li { margin:12px 0; font-size:16px; }
.pd-checks li::before { content:'✓'; color:#007985; font-weight:700; margin-right:12px; }
.pd-workflow { list-style:none; display:grid; grid-template-columns:repeat(4,1fr); gap:40px; padding:0 40px; margin:72px 0 0; text-align:center; position:relative; }
.pd-workflow::before { content:''; position:absolute; top:28px; left:6%; right:6%; height:2px; background:#ccd5df; }
.pd-workflow li { position:relative; }
.pd-workflow span { display:grid; place-items:center; background:#ffbf2e; border-radius:50%; width:56px; height:56px; font-size:16px; font-weight:600; margin:0 auto 14px; }
.pd-workflow p { color:#455e78; font-size:16px; margin-top:14px; }
.pd-product img { display:block; width:100%; height:auto; max-height:500px; object-fit:contain; }
.pd-retail-cards { grid-template-columns:repeat(3,1fr); }
.pd-retail-cards > div { background:#f4f6f8; border-radius:16px; padding:28px; }
.pd-retail-cards .pd-icon { background:white; }
.pd-reservation-cards { grid-template-columns:1fr 1fr; margin-top:40px; gap:16px; }
.pd-reservation-cards > div { display:flex; align-items:flex-start; gap:14px; border:1px solid #ffffff26; border-radius:16px; background:#ffffff0f; padding:16px; }
.pd-reservation-cards h3 { margin:0 0 6px; }
.pd-reservation-cards p { color:white; font-size:14px; }
.pd-reservation-cards .pd-icon { width:48px; height:48px; background:#ffbf2e; color:#0a1a33; }
.pd-reservation-image img { display:block; width:100%; height:auto; border-radius:20px; box-shadow:0 20px 35px #dcf1ef33; }
.pd-reservation-image .pd-caption { color:#79c5c1; }
.pd-kitchen-board { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; background:#0a1a33; border-radius:24px; padding:24px; margin-top:32px; }
.pd-kitchen-board .pd-eyebrow { color:#dcf1ef; margin-bottom:12px; }
.pd-ticket { background:white; border-radius:12px; padding:16px; margin-top:12px; font-size:16px; }
.pd-ticket h3 { font:600 16px/1.3 'Hanken Grotesk',sans-serif; display:flex; justify-content:space-between; gap:12px; }
.pd-ticket h3 span { color:#455e78; }
.pd-ticket p { margin-top:10px; }
.pd-ticket .pd-allergy { color:#007985; }
.pd-status { display:inline-block; margin-top:8px; background:#77c2bf; border-radius:16px; padding:3px 10px; font:800 12px/1.3 'JetBrains Mono',monospace; letter-spacing:2px; }
.pd-preparing { background:#ffbf2e; }
.pd-ready { background:#ff353e; color:white; }
.pd-kitchen-cards { grid-template-columns:repeat(3,1fr); }
.pd-kitchen-cards > div { display:flex; gap:14px; align-items:flex-start; }
.pd-kitchen-cards .pd-icon { width:48px; height:48px; }
.pd-kitchen-cards h3 { margin:0 0 6px; }
.pd-kitchen-cards p { font-size:14px; }
.pd-terminal { padding:24px; border-radius:30px; background:#dcf1ef; text-align:center; }
.pd-device-note { display:inline-block; padding:10px 16px; border-radius:30px; background:white; font-size:14px; }
.pd-terminal img { width:200px; height:406px; max-width:100%; object-fit:contain; display:block; margin:40px auto 0; }
.pd-terminal-steps { list-style:none; padding:0; margin:24px 0; }
.pd-terminal-steps li { display:flex; align-items:center; justify-content:flex-end; gap:14px; margin:12px 0; }
.pd-terminal-steps span { display:grid; place-items:center; width:36px; height:36px; background:#0a1a33; color:white; border-radius:50%; flex:none; font-size:16px; }
.pd-right-copy .pd-actions { justify-content:flex-end; }
.marketing-pos-devices .pd-note { color:#57657a; font-size:14px; line-height:1.4; margin-top:30px; }
.pd-portable { padding:120px 0; background:linear-gradient(90deg,#0a1a33ba,#0a1a3326),url('/assets/founding-carousel/AdobeStock_259094315.jpg') center/cover; }
.pd-portable-card { width:min(560px,100%); background:#ffffffe0; padding:40px; border-radius:24px; }
.pd-portable-card > p:not(.pd-eyebrow) { margin-top:24px; }
.pd-portable-options { display:flex; gap:20px; margin-top:24px; }
.pd-portable-options > div { min-width:0; }
.pd-portable-options .pd-icon { width:48px; height:48px; }
.pd-portable-options p { font-size:14px; margin-top:10px; }
.pd-portable-card .pd-caption { text-align:left; }
.pd-hardware-cards { grid-template-columns:repeat(3,1fr); }
.pd-hardware-cards > div { display:flex; gap:20px; border:1px solid #dde3eb; border-radius:16px; padding:28px; }
.pd-hardware-cards h3 { margin:0 0 8px; }
.pd-hardware-cards p { font-size:14px; }
.pd-faqs { width:min(800px,100%); margin:60px auto 40px; }
.pd-faqs details { border-bottom:1px solid #ccd5df; padding:24px 0; }
.pd-faqs summary { cursor:pointer; font:700 22px/1.3 Archivo,sans-serif; list-style:none; display:flex; justify-content:space-between; gap:20px; }
.pd-faqs summary::-webkit-details-marker { display:none; }
.pd-faqs summary::after { content:'+'; color:#007985; }
.pd-faqs details[open] summary::after { content:'−'; }
.pd-faqs p { margin-top:14px; font-size:16px; }
.pd-final { padding:170px 0; text-align:center; color:white; background:linear-gradient(#0a1a3380,#0a1a3380),url('/assets/figma-home/imgAdobeStock356057247Preview1.png') center/cover; }
.pd-final h2 { color:white; }
.pd-final .pd-actions { justify-content:center; margin-top:36px; }
.marketing-pos-devices :is(a,summary):focus-visible { outline:3px solid #007985; outline-offset:5px; }
.pd-hero a:focus-visible,.pd-navy a:focus-visible,.pd-final a:focus-visible { outline-color:#fff; }
@media(max-width:1100px) { .pd-grid { gap:40px; } .marketing-pos-devices h1 { font-size:64px; } .marketing-pos-devices h2 { font-size:40px; } .pd-hardware-cards > div { padding:20px; gap:14px; } .pd-hardware-cards .pd-icon { width:48px; height:48px; } .pd-platform-image { width:100%; left:auto; transform:none; } }
@media(max-width:767px) { .pd-container { width:calc(100% - 40px); } .pd-section { padding:48px 0; } .pd-grid { grid-template-columns:1fr; gap:32px; } .marketing-pos-devices h1 { font-size:44px; } .marketing-pos-devices h2 { font-size:32px; } .pd-hero { padding:72px 0; } .marketing-pos-devices nav.pd-section-nav { gap:16px 20px; padding:20px; font-size:14px; } .pd-button { padding:12px 18px; } .pd-platform-image { margin-top:36px; } .pd-platform-cards,.pd-retail-cards,.pd-hardware-cards { grid-template-columns:1fr 1fr; } .pd-cards { gap:20px; margin-top:36px; } .pd-workflow { grid-template-columns:1fr 1fr; padding:0; margin-top:40px; gap:32px; } .pd-workflow::before { display:none; } .pd-kitchen-board { grid-template-columns:1fr; } .pd-kitchen-cards { grid-template-columns:1fr; } .pd-right-copy > :last-child { text-align:left; } .pd-terminal-steps li,.pd-right-copy .pd-actions { justify-content:flex-start; } .pd-portable { padding:64px 0; } .pd-portable-card { padding:28px; } .pd-final { padding:80px 0; } .pd-faqs { margin-top:32px; } }
@media(max-width:420px) { .marketing-pos-devices h1 { font-size:38px; } .pd-platform-cards,.pd-retail-cards,.pd-hardware-cards { grid-template-columns:1fr; } .pd-actions { gap:12px; } .pd-actions .pd-button { width:100%; } .pd-reservation-cards { grid-template-columns:1fr; } .pd-portable-options { gap:12px; } .pd-terminal { padding:20px; } }

/* Card terminal section from the supplied POS & Devices reference only. */
#card-terminals .pd-terminal { background:#DCF1EF; padding:24px; text-align:left; }
#card-terminals .pd-device-note { display:inline-flex; align-items:center; gap:10px; background:#fff; color:#0a1a33; font-size:12px; line-height:1.4; padding:10px 14px; }
#card-terminals .pd-device-note svg { flex:none; color:#007985; }
#card-terminals .pd-terminal img { display:block; width:min(100%,300px); height:auto; margin:28px auto 0; object-fit:contain; }
#card-terminals .pd-terminal-steps { margin:24px 0; }
#card-terminals .pd-terminal-steps li { margin:20px 0; gap:12px; }
#card-terminals .pd-terminal-steps span { display:inline; flex:none; width:auto; height:auto; background:none; color:inherit; border-radius:0; font-size:18px; font-weight:600; }
#card-terminals .pd-note { color:#DCF1EF; font-style:italic; font-size:14px; line-height:1.5; margin-top:24px; }
#card-terminals .pd-button.pd-outline { color:#fff; border-color:#fff; }
@media(max-width:767px) { #card-terminals .pd-terminal img { width:min(100%,260px); } #card-terminals .pd-terminal-steps li { align-items:flex-start; } }

/* Keep every POS action arrow centred beside its label, without a text baseline offset. */
.pd-button > span[aria-hidden="true"] { display:inline-flex; align-items:center; justify-content:center; align-self:center; flex:0 0 16px; width:16px; height:16px; margin:0; padding:0; line-height:1; transform:none; rotate:none; }
.pd-button [data-dp-action-arrow] { align-self:center!important; vertical-align:middle!important; transform:none!important; rotate:none!important; margin:0!important; }

/* Detail links use the same level, right-pointing artwork as the demo buttons. */
.pd-detail { display:flex; align-items:center; justify-content:center; gap:8px; width:fit-content; max-width:100%; margin-inline:auto; }
.pd-grid .pd-detail { margin-inline:0; justify-content:flex-start; }
.pd-detail > span[aria-hidden="true"] { display:inline-flex; align-items:center; justify-content:center; flex:0 0 16px; width:16px; height:16px; line-height:1; transform:none; rotate:none; }
.pd-detail [data-dp-action-arrow] { align-self:center!important; vertical-align:middle!important; transform:none!important; rotate:none!important; margin:0!important; }
