/* BroadbandMatch's colourful visual identity. */
:root{--ink:#202045;--muted:#606078;--paper:#fffcf7;--lime:#ffe390;--line:#e4e0ed;--coral:#f14e36;--violet:#6551d7;--aqua:#d5f2ec}
body{background:#fffcf7}
header{padding-top:24px;padding-bottom:24px}
.brand-icon{background:#6551d7;color:#fff1b3;box-shadow:4px 4px 0 #ffb3a3;transform:rotate(-5deg)}
.brand small{color:#7d7397}
.nav-cta{border-color:#ddd5fa;background:#f0ebff;color:#4b399d;border-radius:100px}
.hero{position:relative;gap:45px;padding-top:45px;padding-bottom:58px}
.hero-copy .eyebrow{display:inline-flex;align-items:center;letter-spacing:1.4px;background:#fff0cc;color:#715010;padding:8px 12px;border-radius:100px;font-size:9px}
.dot{background:#ec6744;box-shadow:0 0 0 4px #f9d58a70;width:6px;height:6px}
h1{font-weight:800;letter-spacing:-2.8px;font-size:clamp(42px,4.6vw,62px);line-height:1.08}
h1 em{color:#e94f37;position:relative}
.intro{line-height:1.75}
.button{border-radius:100px;padding:16px 23px;transition:transform .16s,box-shadow .16s,background .16s}
.primary{background:#e84b33;color:white;box-shadow:0 5px 0 #b83423}
.primary:hover{background:#cf3e28;box-shadow:0 3px 0 #a63021;transform:translateY(2px)}
.button>span:last-child{font-size:18px}
.hero .button{gap:65px}
.hero-notes{display:flex;gap:8px;flex-wrap:wrap;margin:20px 0 0}
.hero-notes span{font-size:10px;font-weight:600;display:inline-flex;align-items:center;gap:6px;padding:5px 10px;border:1px solid #e6dfed;border-radius:100px;background:white}
.hero-notes span::before{content:'✓';color:#17806a;font-weight:800}
.hero .micro{font-size:10px}
.connection-scene{background:#dcd5fc;border-radius:36px;aspect-ratio:1/1.04;box-shadow:10px 12px 0 #f8d97b;isolation:isolate;border:1px solid #cfc4ef}
.connection-scene::before{content:'';position:absolute;background:#fff0b7;width:70%;height:70%;left:15%;top:15%;border-radius:50%;z-index:-1}
.connection-scene::after{content:'✦';position:absolute;right:8%;top:14%;font-size:54px;color:#f37c60;transform:rotate(12deg);line-height:1;z-index:-1}
.scene-label{top:32px;color:#574595;letter-spacing:2.2px;font-weight:800}
.orbit{border-color:#a894cf60;width:90%;left:5%}
.orbit-two{border-color:#a894cf70}
.house{width:91%;left:4.5%;top:22%;filter:drop-shadow(0 16px 10px #513a7c18)}
.scene-card{border:1px solid #ffffffb0;background:#fffdf7;box-shadow:0 8px 0 #6551d720;border-radius:14px;padding:15px 17px}
.scene-card b{font-size:12px;color:#292046}
.scene-card small{font-size:9px;color:#686278}
.fibre-tag{top:19%;left:5%;transform:rotate(-7deg)}
.fiveg-tag{bottom:14%;right:4%;transform:rotate(6deg)}
.fibre-tag .mini-icon{background:#c8f2e7;color:#0e6c59}
.fiveg-tag .mini-icon{background:#ffe1b2;color:#915420}
.signal{color:#21826d}
.scene-foot{color:#574595;bottom:24px}
.providers{background:#fff;border-top:1px solid #eee8df;border-bottom:1px solid #eee8df;padding:27px 0 23px}
.providers .eyebrow{color:#80788d;font-size:9px}
.provider-names{gap:12px;max-width:1000px;margin:20px auto}
.provider-names span{flex:1;text-align:center;background:#f8f5ff;border:1px solid #e8e0fa;padding:12px;border-radius:12px;font-size:24px;color:#4e3e92}
.provider-names span:nth-child(2){background:#fff0ec;border-color:#f8d9cd;color:#b94232}
.provider-names span:nth-child(3){background:#edf9ee;border-color:#d3e7d6;color:#376c44}
.provider-names span:nth-child(4){background:#edf4ff;border-color:#d6e5f9;color:#345c93}
.provider-names span:nth-child(5){background:#fff5dc;border-color:#f1e2af;color:#8d5919}
.section{padding-top:76px;padding-bottom:66px}
h2{font-weight:700;letter-spacing:-1.6px}
.section-top .eyebrow,.coverage .eyebrow,.faq .eyebrow{color:#6a4eb3}
.path{border:0;border-radius:20px;padding:34px;box-shadow:0 4px 0 #22204510;overflow:hidden}
.path::before{content:'';position:absolute;left:0;top:0;bottom:0;width:6px;background:#51bba3}
.path.fiveg::before{background:#a38ae1}
.fibre{background:#e4f5ed}
.fiveg{background:#eee7fc}
.path-number{color:#1a6f5a;letter-spacing:1.7px}
.fiveg .path-number{color:#7151ad}
.path-symbol{border:0;border-radius:13px;background:#9de0c7;color:#14513e;width:46px;height:46px;transform:rotate(7deg);top:24px}
.fiveg .path-symbol{background:#cfb8f6;color:#58328d;transform:rotate(-7deg)}
.path h3{font-weight:800;letter-spacing:-1px;margin-top:35px}
.path .text-button{border-top-color:#badfcd;color:#1d5d49;padding-top:21px}
.fiveg .text-button{border-top-color:#d0c1e9;color:#654092}
.path dl{margin-bottom:26px}
.process{background:#5041ad;position:relative;color:white;padding:58px 0}
.process .eyebrow{color:#ffe095}
.process h2{color:#fffdf5}
.steps article{border-color:#ffffff30}
.steps article>span{display:inline-grid;place-items:center;color:#473082;background:#ffe093;width:32px;height:32px;border-radius:10px;font-weight:700;transform:rotate(-6deg)}
.steps article:nth-child(2)>span{background:#a9e8d9;transform:rotate(5deg)}
.steps article:nth-child(3)>span{background:#ffb9a5;transform:rotate(-5deg)}
.steps h3{color:#fffdf5;line-height:1.4}
.steps p{color:#e7e0fa;line-height:1.8}
.coverage h2 em{color:#de4b34}
.agent-avatar{background:#ffe19c;color:#705118;box-shadow:3px 3px 0 #f0bb68}
.coverage form{border:2px solid #e1d6f5;border-top:6px solid #8971cf;border-radius:20px;box-shadow:8px 9px 0 #f0e8fc;padding:28px;background:#fff}
.segmented span{border-color:#e5dfee;border-radius:9px;color:#6c627b;background:#faf7fe;padding:12px 6px;font-size:11px}
.segmented input:checked+span{background:#6551c7;border-color:#6551c7;color:white;box-shadow:0 3px 0 #d6cbf1}
input:not([type=radio]):not([type=checkbox]),select{background:#fcfaff;border-color:#e3ddef;border-radius:8px;color:#302943;min-height:45px}
input::placeholder{color:#777080}
.path-hint{background:#fff4d9;color:#6c572b;border-left:3px solid #efbf52;border-radius:7px}
.check input{accent-color:#6551c7}
.check a{color:#6541a5}
.submit{margin-bottom:6px}
.faq details{background:#fff;border:1px solid #e8e0f0;border-radius:12px;margin-bottom:10px;padding:18px 20px}
.faq details[open]{background:#f5f0ff;border-color:#cfc0e9}
.faq summary{font-size:13px}
.privacy{background:#f5f1fa;border-top:0;border-radius:20px;margin-bottom:35px;padding:30px 34px;max-width:1128px}
.privacy .eyebrow{color:#7b5c9e}
.privacy h2{font-weight:700}
.inline-button,.privacy a{color:#6541a5}
footer{border-color:#e7deef}
footer .brand{color:#57409e}
.mobile-cta{background:#e84b33;box-shadow:0 4px 0 #a72f20,0 6px 24px #b6343325;border-radius:100px}
dialog{border:2px solid #dbcef0;border-radius:20px}
dialog::backdrop{background:#29204c99}
.secondary{background:#eee8fb;color:#553d8b}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline-color:#6851cf}
@media(max-width:800px){.hero{gap:30px}.scene-card{padding:11px 12px}.scene-card b{font-size:10px}.scene-card small{font-size:8px}.provider-names span{font-size:18px;padding:11px 8px}.coverage form{padding:20px}.path{padding:26px}.privacy{margin-left:24px;margin-right:24px}.steps article>span{width:28px;height:28px}}
@media(max-width:600px){header{padding:20px}.hero{padding-top:18px;padding-bottom:43px;gap:30px}h1{font-size:39px;letter-spacing:-1.9px;line-height:1.08;margin:21px 0}.hero-copy .eyebrow{font-size:8px;padding:7px 10px;letter-spacing:1px}.hero .intro{font-size:15px;margin-bottom:25px}.hero-notes{justify-content:center;margin-top:20px;gap:6px}.hero-notes span{font-size:9px;padding:4px 8px}.hero .micro{font-size:9px;margin-top:10px}.connection-scene{border-radius:26px;aspect-ratio:1.05;box-shadow:6px 7px 0 #f6d67e;margin-right:6px}.scene-label{font-size:8px;top:24px}.connection-scene::after{font-size:42px;right:9%;top:14%}.house{top:20%}.scene-card{padding:11px 13px}.scene-card b{font-size:11px}.scene-card small{font-size:8px}.scene-foot{font-size:6px;bottom:18px}.fibre-tag{top:18%;left:4%}.fiveg-tag{bottom:13%;right:4%}.providers{padding:22px 0}.provider-names{flex-wrap:wrap;gap:8px;margin:17px 0}.provider-names span{flex:0 0 calc(33.333% - 6px);font-size:18px;padding:10px 5px;border-radius:9px}.provider-names span:nth-child(4),.provider-names span:nth-child(5){flex-basis:calc(50% - 5px)}.section{padding-top:48px;padding-bottom:44px}.section-top h2{max-width:290px}.path{padding:27px}.path h3{margin-top:35px}.process{padding:39px 0}.steps{margin-top:28px;gap:16px}.steps article{padding-top:20px;padding-left:45px}.steps article>span{left:0;top:20px}.steps h3{font-size:18px}.steps p{margin-bottom:9px}.coverage{gap:29px}.coverage form{padding:21px 17px;box-shadow:5px 6px 0 #f0e8fc}.coverage h2{font-size:36px}.segmented span{font-size:10px}.form-row{gap:10px}.privacy{margin-left:16px;margin-right:16px;padding:24px 20px;border-radius:16px;margin-bottom:12px}.privacy h2{font-size:21px}.faq details{padding:16px}.mobile-cta{bottom:15px;left:17px;right:17px}footer{padding-bottom:102px}}
@media(prefers-reduced-motion:reduce){.button{transition:none}.primary:hover{transform:none}}
