/* Shared product primitives. Each SEO site retains its own type and palette. */
:root { color-scheme: light; --story-accent:#126b52; --story-ink:#193d35; --story-muted:#5e7569; --story-wash:#e8efe1; --story-paper:#fbf9f4; }
body { overflow-x:clip; }
.seo-country-field { display:grid; gap:8px; margin-block:18px; font:500 14px/1.5 system-ui,sans-serif; }
.seo-country-field select { padding:13px; border:1px solid #8a9c96; border-radius:8px; background:#fff; color:#254237; width:100%; min-height:48px; }
.form-security-status { font:500 14px/1.6 system-ui,sans-serif; margin-top:16px; }
.form-security-fallback { display:inline-block; margin-top:8px; text-decoration:underline; }
.form-security-fallback[hidden] { display:none; }
.reveal,.reveal-group,.stagger,.stagger-in,.reveal > *,.stagger > *,.rise,.rise-lcp,[data-reveal] { opacity:1!important; visibility:visible!important; transform:none!important; animation:none!important; }
.reveal-group > *,.reveal .quad > div,.reveal .ruled > *,.reveal .faq > details,.reveal .compare tbody tr,.reveal .steps > *,.stagger-in > * { opacity:1!important; translate:none!important; animation:none!important; }
.reveal,[data-reveal] { translate:none!important; }
.integration-catalogue { box-sizing:border-box; max-width:1152px; width:calc(100% - 2rem); margin:2.5rem auto; }
.integration-rail { max-width:1152px; display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); align-items:center; gap:14px; margin:25px auto 45px; padding:0 24px; }
.integration-rail a { display:grid; place-items:center; height:78px; padding:15px; border-radius:12px; background:#fff; border:1px solid #e1e8e3; }
.integration-rail img { width:110px; height:38px; object-fit:contain; filter:none!important; opacity:1!important; }
.integration-catalogue ul { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; padding:0; margin:0; list-style:none; }
.integration-catalogue li a { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:12px; min-height:118px; padding:18px 10px; border:1px solid #e2e7e5; border-radius:16px; background:#fff; color:#243c35; text-decoration:none; transition:transform .2s,border-color .2s,box-shadow .2s; }
.integration-catalogue li a:hover { transform:translateY(-3px); border-color:#87ad9f; box-shadow:0 10px 24px #163a2410; }
.integration-catalogue img,.vendor-mark img,.integration-logo { display:block; width:100px!important; height:42px!important; max-width:100%; object-fit:contain!important; filter:none!important; opacity:1!important; mix-blend-mode:normal!important; }
.integration-catalogue span { font:600 12px/1.3 system-ui,sans-serif; text-align:center; }
.integration-catalogue .api-icon { font:700 27px/42px monospace; color:#2858a0; }
.integration-catalogue p { font:400 14px/1.7 system-ui,sans-serif; margin-top:18px; max-width:75ch; }
.integration-more { margin-top:14px; }
.integration-more summary { cursor:pointer; display:flex; justify-content:space-between; gap:15px; padding:16px 20px; border:1px solid currentColor; border-radius:12px; font:600 13px/1.5 system-ui,sans-serif; }
.integration-more[open] summary { margin-bottom:14px; }
main > .integration-catalogue { max-width:1152px; margin:35px auto; padding:0 24px; }
.vendor-mark { display:inline-flex!important; width:160px!important; height:76px!important; align-items:center; justify-content:center; padding:14px!important; border-radius:12px; background:#fff!important; margin-top:12px; filter:none!important; }
.vendor-mark img { width:126px!important; height:45px!important; }
.integration-heading { display:flex; align-items:center; gap:18px; margin-bottom:12px; }
.integration-heading .integration-logo { width:88px!important; height:42px!important; padding:7px; box-sizing:content-box; background:white; border-radius:8px; }
.powered-by-talkify { display:inline-flex; align-items:center; gap:10px; text-decoration:none; margin-top:20px; font:500 12px/1.3 system-ui,sans-serif; }
.powered-by-talkify img { width:116px; height:auto; object-fit:contain; background:transparent!important; border-radius:0; padding:0!important; }
.powered-by-talkify picture { display:flex; align-items:center; }
.site-tradie .ios-device { border-color:#c0c5c5; background:linear-gradient(130deg,#fefefe,#c8d0d3 40%,#f3f5f6 75%,#a3adb1); box-shadow:0 28px 60px -20px #0008,inset 0 0 0 2px #e9edee; }
.site-tradie .ios-screen { background:radial-gradient(ellipse at 90% 0,#fffbe0,transparent 70%),linear-gradient(145deg,#e9eee2,#aab9aa); }
.trade-connections { max-width:1152px; margin:30px auto; padding-inline:24px; }
.trade-connections-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:15px; }
.trade-connection { background:#fff; color:#263d34; border:1px solid #dce5df; border-radius:13px; padding:23px; }
.trade-connection img { width:140px; height:48px; object-fit:contain; object-position:left center; filter:none!important; }
.trade-connection h3 { font-size:18px; margin:20px 0 8px; font-weight:700; }
.trade-connection p { font-size:13px; line-height:1.7; margin:0; color:#587065; }
.trade-connection a { display:inline-block; margin-top:18px; font-size:12px; font-weight:650; text-decoration:underline; }
.trade-connections-note { font-size:13px; line-height:1.7; opacity:.8; margin-top:18px; }
@media(max-width:900px) { .trade-connections-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:480px) { .trade-connections { padding-inline:16px; }.trade-connection { padding:16px; }.trade-connection img { max-width:100%; height:40px; } }
/* An actual phone silhouette, not a rounded message card. */
.ios-device { --device-accent:#08745d; box-sizing:border-box; position:relative; width:296px; max-width:100%; min-height:590px; padding:9px; margin:0 auto; border:2px solid #7b7e80; border-radius:49px; background:linear-gradient(135deg,#34383b,#08090b 38%,#282c30); box-shadow:0 28px 65px -23px #172c3c70,inset 0 0 0 2px #111; color:#173b32; font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; text-align:left; isolation:isolate; }
.ios-device::before { content:""; position:absolute; right:-4px; top:143px; width:3px; height:62px; border-radius:0 3px 3px 0; background:#62686b; }
.ios-screen { box-sizing:border-box; position:relative; overflow:hidden; min-height:568px; padding:15px 12px 37px; border-radius:38px; background:radial-gradient(ellipse at 90% 20%,#fff9dd 0,transparent 45%),radial-gradient(ellipse at 0 100%,#3f988f 0,transparent 65%),linear-gradient(150deg,#d1e8df,#a5ccd8); }
.ios-island { position:absolute; z-index:2; top:10px; left:50%; transform:translateX(-50%); width:86px; height:25px; background:#070809; border-radius:30px; }
.ios-island::after { content:""; position:absolute; right:9px; top:8px; width:8px; height:8px; border-radius:50%; background:#111a29; box-shadow:inset 0 0 2px #30465d; }
.ios-status { display:flex; justify-content:space-between; padding:0 8px; color:#183830; font:650 11px/18px system-ui,sans-serif; }
.ios-status svg { width:47px; height:14px; }
.ios-lock { text-align:center; padding:39px 0 27px; }
.ios-lock small { font:550 13px/1.4 system-ui,sans-serif; }
.ios-lock strong { display:block; color:#18483f; font:250 67px/.98 system-ui,sans-serif; letter-spacing:-4px; margin-top:5px; }
.ios-notifications { display:grid; gap:9px; }
.ios-notification { padding:12px; background:rgba(255,255,255,.79); border:1px solid #ffffff90; box-shadow:0 3px 8px #16473c08; border-radius:20px; color:#18382f; font:400 12px/1.45 system-ui,sans-serif; }
.ios-notification header { display:flex; align-items:center; gap:6px; margin-bottom:6px; font-size:10px; font-weight:650; letter-spacing:.02em; }
.ios-notification header img { width:19px; height:19px; border-radius:5px; object-fit:contain; background:#fff; padding:2px; }
.ios-notification header time { margin-left:auto; color:#5a7069; font-size:9px; font-weight:400; }
.ios-notification b { display:block; color:#163a31; font:650 12px/1.45 system-ui,sans-serif; margin:0 0 3px; }
.ios-notification p { font:400 12px/1.45 system-ui,sans-serif; margin:0; color:#254d41; }
.ios-home { position:absolute; bottom:9px; left:50%; transform:translateX(-50%); width:92px; height:4px; background:#17372db0; border-radius:8px; }
.ios-example { display:block; text-align:center; margin:18px auto 0; max-width:330px; font:400 12px/1.6 system-ui,sans-serif; opacity:.7; }
.ios-pair { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); align-items:center; gap:50px; }
.ios-pair .sheet { margin:0; }
/* Voice Assistant: remove leftover square highlights from the old theme. */
body.site-voice .panel::after,body.site-voice .panel::before,body.site-voice .masthead::after,body.site-voice .band-lit::before { display:none!important; }
body.site-voice::before,body.site-voice::after { display:none; }
body.site-voice .band-lit { padding:4rem 2.5rem; margin-block:2rem; }
body.site-voice .panel { border:1px solid #dfe8f0; box-shadow:0 15px 36px -28px #263e6360; background-image:none; }
body.site-voice .panel-accent { background:#edf5ff; }
/* Two distinct, light editorial identities around the same accessible story. */
.site-phone { --paper:#fbf9f4; --surface:#fff; --band:#f0eee5; --ink:#193d35; --muted:#5a7067; --hair:#dbe3da; --accent:#146a53; --accent-hover:#0b503d; --accent-ink:#fff; --field-bg:#fff; --field-hair:#c9d7cf; --band-bg:#193d35; --band-text:#fff; --band-muted:#c1d8ce; background:#fbf9f4!important; color:var(--ink); }
.site-phone .site-header { background:#fbf9f4ed; backdrop-filter:blur(18px); }
.site-phone .hero-note { position:static; transform:none; width:auto; }
.site-phone .hero-art:has(.ios-device) { padding-block:20px; }
.site-phone .hero-art:has(.ios-device) .hero-photo-wrap { display:none; }
.site-phone .section { padding-block:clamp(3.5rem,6vw,6rem); }
.site-phone .band .muted-copy { color:#c1d8ce; }
.journey { --story-accent:#126b52; --story-ink:#193d35; --story-muted:#5e7569; --story-wash:#e8efe1; --story-paper:#fbf9f4; background:var(--story-paper); color:var(--story-ink); }
.site-voice .journey { --story-accent:#2460c2; --story-ink:#182d4b; --story-muted:#60728c; --story-wash:#e5eefc; --story-paper:#f8fbff; }
.journey-intro { max-width:1060px; padding:64px 24px 38px; margin:auto; text-align:center; }
.journey-kicker { display:inline-flex; align-items:center; gap:9px; font:650 11px/1.5 system-ui,sans-serif; letter-spacing:.15em; text-transform:uppercase; color:var(--story-accent); }
.journey-kicker::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; box-shadow:0 0 0 4px color-mix(in srgb,currentColor 10%,transparent); }
.journey h1 { max-width:870px; margin:20px auto; font-size:clamp(38px,5.2vw,70px); line-height:1.05; letter-spacing:-.045em; text-wrap:balance; }
.journey h1 em { font-style:normal; color:var(--story-accent); }
.journey-intro > p { max-width:570px; margin:20px auto; color:var(--story-muted); font-size:18px; line-height:1.65; }
.journey-actions { display:flex; flex-wrap:wrap; justify-content:center; gap:12px; margin-top:25px; }
.journey-link { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:11px 22px; border:1px solid var(--story-accent); border-radius:30px; background:var(--story-accent); color:white; text-decoration:none; font:600 14px/1.4 system-ui,sans-serif; transition:transform .2s; }
.journey-link:hover { transform:translateY(-2px); }
.journey-link.secondary { background:transparent; color:var(--story-accent); border-color:color-mix(in srgb,var(--story-accent) 25%,transparent); }
.journey-intro .journey-price { font:400 12px/1.6 system-ui,sans-serif; margin:17px auto 0; max-width:650px; }
.journey-layout { max-width:1120px; margin:auto; display:grid; grid-template-columns:1fr 1fr; gap:90px; padding:0 30px 50px; align-items:start; }
.journey-visual { position:sticky; top:100px; padding:28px 0; }
.journey-halo { position:absolute; inset:14% -8% 0; z-index:-1; border-radius:50%; background:radial-gradient(ellipse,var(--story-wash) 0,transparent 70%); }
.journey-visual .ios-device { transform:rotate(-4deg); transition:transform .65s ease; }
.journey[data-step="1"] .ios-device { transform:rotate(0); }
.journey[data-step="2"] .ios-device { transform:rotate(3deg); }
.site-voice .ios-screen { background:radial-gradient(ellipse at 100% 10%,#f4eaff,transparent 50%),linear-gradient(150deg,#d4edfc,#8aabd8); }
.site-voice .ios-lock strong { color:#234575; }
.journey-phone-label { margin:20px 0 0; color:var(--story-muted); text-align:center; font:500 11px/1.5 system-ui,sans-serif; letter-spacing:.03em; }
.journey-nav { display:flex; justify-content:center; gap:8px; margin-top:16px; }
.journey-nav button { cursor:pointer; min-width:44px; min-height:44px; padding:8px 12px; border-radius:25px; border:1px solid color-mix(in srgb,var(--story-accent) 22%,transparent); color:var(--story-accent); background:transparent; font:600 12px/1 system-ui,sans-serif; }
.journey-nav button[aria-pressed="true"] { background:var(--story-accent); color:white; }
.journey button:focus-visible,.journey a:focus-visible,.integration-catalogue a:focus-visible { outline:3px solid #c98725; outline-offset:4px; }
.journey-chapter { min-height:70vh; min-height:70svh; display:flex; flex-direction:column; justify-content:center; padding:80px 0; scroll-margin-top:110px; }
.journey-chapter .chapter-number { color:var(--story-accent); font:650 11px/1.5 system-ui,sans-serif; letter-spacing:.15em; text-transform:uppercase; }
.journey-chapter h2 { font-size:clamp(30px,3.3vw,46px); line-height:1.1; letter-spacing:-.035em; margin:18px 0; text-wrap:balance; }
.journey-chapter > p { max-width:37ch; color:var(--story-muted); font-size:17px; line-height:1.8; }
.journey-proof { display:flex; align-items:center; gap:12px; border-top:1px solid color-mix(in srgb,var(--story-accent) 18%,transparent); padding-top:20px; margin-top:25px; font:500 13px/1.6 system-ui,sans-serif; }
.journey-proof::before { content:"✓"; width:24px; height:24px; display:grid; place-items:center; border-radius:50%; color:var(--story-accent); background:var(--story-wash); }
.story-screen[hidden] { display:none!important; }
.story-screen { animation:screen-arrive .4s ease; }
.story-call { text-align:center; padding:40px 15px 20px; }
.story-avatar { display:grid; place-items:center; width:64px; height:64px; background:#ffffffa0; border-radius:50%; margin:0 auto 15px; font-size:28px; }
.story-call h3 { font:650 21px/1.3 system-ui,sans-serif; margin:0; color:#1e443b; }
.story-call p { font:400 12px/1.7 system-ui,sans-serif; margin:8px 0; color:#3d655d; }
.story-call .call-accept { display:grid; place-items:center; width:56px; height:56px; border-radius:50%; background:#168454; color:white; font-size:24px; margin:55px auto 10px; }
.story-wave { display:flex; align-items:center; justify-content:center; gap:4px; height:40px; margin:26px 0; }
.story-wave i { width:4px; height:12px; border-radius:5px; background:#1f776c; animation:wave 1s ease-in-out infinite alternate; }
.story-wave i:nth-child(2n) { height:30px; animation-delay:.2s; }
.story-wave i:nth-child(3n) { height:21px; animation-delay:.5s; }
.journey-photo { display:grid; grid-template-columns:1.2fr 1fr; max-width:1120px; margin:20px auto 70px; border-radius:28px; background:var(--story-wash); overflow:hidden; }
.journey-photo img { width:100%; height:100%; min-height:320px; object-fit:cover; }
.journey-photo div { align-self:center; padding:40px; }
.journey-photo h2 { font-size:clamp(26px,3vw,38px); line-height:1.15; letter-spacing:-.03em; margin:0 0 18px; }
.journey-photo p { color:var(--story-muted); font-size:16px; line-height:1.75; }
/* AI Receptionist listening page: photo and transcript have clear roles. */
.sounds-opening { display:grid; grid-template-columns:1.05fr 1fr; align-items:center; gap:55px; padding-block:35px 70px; }
.sounds-opening h1 { font-size:clamp(38px,4.4vw,60px); line-height:1.05; letter-spacing:-.035em; }
.sounds-photo { position:relative; margin:0; }
.sounds-photo img { width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:120px 28px 28px 28px; }
.sounds-photo figcaption { position:absolute; bottom:24px; left:-20px; right:25px; background:#fdfbf5ed; padding:19px 23px; border-radius:17px; box-shadow:0 12px 35px #203d2520; font:500 14px/1.6 system-ui,sans-serif; color:#294638; }
.sounds-photo figcaption strong { display:block; color:#347a61; font-size:11px; text-transform:uppercase; letter-spacing:.12em; margin-bottom:4px; }
.sounds-page .transcript { border-radius:20px; overflow:hidden; box-shadow:0 20px 50px -30px #284c3840; }
.sounds-page .turn:nth-child(2n) { background:#f0f5ed; }
.sounds-page .turn { padding-block:20px; }
.sounds-page .band { background:#edf3e8; }
@keyframes screen-arrive { from{opacity:.35;transform:translateY(8px)} to{opacity:1;transform:none} }
@keyframes wave { to{transform:scaleY(.45)} }
@media(min-width:1500px) { .journey-chapter { min-height:640px; } }
@media(max-width:900px) {
 .integration-catalogue ul { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .journey-layout { gap:35px; }
 .journey-intro { padding-top:45px; }
 .journey-photo { margin-inline:22px; }
 .sounds-opening { gap:25px; }
}
@media(max-width:680px) {
 .lamplight::before,.textlamp::before { left:0!important; right:0!important; }
 .masthead__inner { flex-wrap:wrap; height:auto!important; gap:12px!important; padding-block:15px; }
 .masthead__inner .navlinks { order:2; flex-basis:100%; flex-wrap:wrap; overflow:visible; mask-image:none; -webkit-mask-image:none; gap:10px 17px; padding:0; }
 .masthead__inner .navlinks a { font-size:12px; }
 .journey-halo { inset:10% 0 0; }
 body.site-voice .site-nav { flex-wrap:wrap; overflow:visible; gap:10px 18px; mask-image:none; -webkit-mask-image:none; padding-block:10px; }
 body.site-voice .site-nav .nav-link { font-size:12px; }
 .integration-rail { grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; padding:0 20px; }
 .integration-rail a { height:64px; padding:12px; }
 .integration-rail img { width:80px; height:30px; }
 .integration-catalogue { width:100%; }
 .band > .integration-catalogue { width:calc(100% - 2.5rem); }
 .integration-catalogue ul { grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
 .integration-catalogue li a { min-height:105px; padding:13px 8px; }
 .integration-catalogue img { width:90px!important; height:34px!important; }
 .ios-pair,.sounds-opening,.journey-photo { grid-template-columns:1fr; gap:28px; }
 .ios-device { width:278px; min-height:556px; }
 .ios-screen { min-height:534px; }
 .journey-layout { display:flex; flex-direction:column; gap:0; padding:0 24px 25px; }
 .journey-visual { position:relative; top:auto; align-self:center; width:100%; padding:18px 0 5px; }
 .journey .ios-device { transform:none!important; }
 .journey-chapter { min-height:0; padding:35px 0; border-bottom:1px solid var(--story-wash); }
 .journey-chapter > p { max-width:100%; }
 .journey-chapter h2 { font-size:31px; margin:12px 0; }
 .journey-intro { padding:36px 22px 25px; }
 .journey h1 { font-size:40px; }
 .journey-intro > p { font-size:16px; }
 .journey-photo { margin:15px 20px 40px; gap:0; }
 .journey-photo img { min-height:240px; max-height:330px; }
 .journey-photo div { padding:28px; }
 body.site-voice .band-lit { padding:2.5rem 1.25rem; border-radius:20px; }
 .sounds-photo img { aspect-ratio:5/4; border-radius:60px 20px 20px; }
 .sounds-photo figcaption { left:12px; right:12px; bottom:15px; padding:14px; }
 .sounds-opening { padding-bottom:40px; }
}
@media(prefers-reduced-motion:reduce) {
 .story-screen,.story-wave i { animation:none; }
 .journey-visual .ios-device,.integration-catalogue a,.journey-link { transition:none; transform:none!important; }
 .journey-visual { position:relative; top:auto; }
 .journey-chapter { min-height:0; padding:38px 0; }
}
