/* Edge styling applied to the plans pages (#2408). Loaded after h.css, plans.css and edge.css.
   Rules: Edge display face, flat sections, 3px corners and 1px borders, no pills or bubbles. Colours come only from the tokens in h.css. */
:focus-visible{outline-width:2px}
.price,.cmp thead th,.cmp .big,.plans4.pc .price,.zlist .n,.mk{font-family:Edge,sans-serif}
.price{font-size:clamp(72px,10vw,120px);letter-spacing:-.02em}
.price small{font-family:Arial,sans-serif}
/* heroes: photo strip and video stay, type scale follows Edge */
.hero.has-photos{min-height:clamp(480px,44vw,640px);padding:38px 0 0}
.hero.has-photos h1{max-width:11ch;text-shadow:none}
.hero.has-video h1{max-width:none}
.hero.has-photos .hero-grid{padding:60px 0 56px}
.hero.has-video .hero-grid{gap:70px;padding:60px 0 56px}
.hero.has-photos .btn{border-color:var(--white)}
.hero.has-photos .btn-amber{border-color:var(--amber)}
/* flat, square components */
.honest{border:1px solid var(--line);border-radius:0;background:transparent}
.tbl-wrap{border:1px solid var(--navy);border-radius:0;box-shadow:none;background:var(--white)}
.cmp thead th{border-bottom:2px solid var(--navy)}
.cmp .grp th{background:var(--navy);font-weight:400}
.plans4 .card,.plans4.pc .card{background:transparent;padding:24px 0 20px}
.plans4.pc .card .btn{width:100%;justify-content:center;padding:13px 16px;font-size:15px}
.plans4.pc .price{font-size:64px}
.plans4.pc .card h3{font-size:34px}
.pricing .card{background:var(--white);padding:34px}
.pricing .card .btn{font-size:15px;padding:13px 21px}
.sw{border-radius:0}
dialog{border:1px solid var(--navy);border-radius:3px}
dialog.zoom{border-radius:3px}
.zhead{border-bottom:1px solid var(--navy)}
.zlist{border-left:1px solid var(--navy)}
.mk{border:1px solid var(--navy);border-radius:2px;box-shadow:none;width:30px;height:30px;line-height:28px;font-size:17px}
.zlist .n{border:1px solid var(--navy);border-radius:2px;font-size:17px}
.steps .bar{background:var(--navy)}
.steps button{min-height:78px}
.steps button[aria-selected=true]{background:var(--amber)}
.steps b{font-weight:700}
.demo{gap:64px}
.look{border:1px solid var(--navy);background:var(--amber);border-radius:3px}
.screen .toggle{border-radius:3px}
.drawing .dim{border-top:1px solid var(--navy);border-bottom:1px solid var(--navy)}
.shared-line{font-size:20px}
.price-lead{max-width:42ch}
@media (max-width:1060px){.demo{gap:30px}.hero.has-video .hero-grid{gap:28px}}
@media (max-width:640px){
 .hero.has-photos{min-height:420px}.hero.has-photos h1{font-size:78px;max-width:none}.hero.has-photos .hero-grid{padding:34px 0 36px}
 .hero.has-video{min-height:560px}.hero.has-video .hero-grid{padding:30px 0 70px}
 .plans4.pc .price{font-size:56px}.pricing .card{padding:22px}
 .zhead h2{font-size:26px}.steps button{min-height:112px}
}
/* pricing comparison (#2409/#2410) */
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.compare-hero{min-height:0;padding:30px 0 0}
.compare-hero .wrap{display:block}
.compare-hero h1{font-size:clamp(56px,6.5vw,92px);padding:22px 0 8px;max-width:none}
section.compare-band{padding:24px 0 72px}
.tbl-wrap{overflow-x:auto;position:relative}
table.cmp{table-layout:fixed;width:100%;min-width:820px;border-collapse:collapse;font-size:16px}
.cmp col.c0{width:28%}
.cmp thead th{padding:18px 14px;text-align:left;vertical-align:bottom;background:var(--sky);white-space:nowrap}
.cmp thead th strong{display:block;font:700 clamp(20px,1.8vw,26px)/1.05 Edge,sans-serif;letter-spacing:-.01em;text-decoration:none}
.cmp thead th .seeplan{display:inline-block;margin-top:8px;font:12px ui-monospace,Menlo,monospace;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;color:var(--blue2)}
.cmp thead th .seeplan:hover{text-decoration:underline}
.cmp tbody th{width:auto;font-weight:700;background:var(--white)}
.cmp th:first-child,.cmp td:first-child{position:sticky;left:0;z-index:1;background:var(--white)}
.cmp thead th:first-child{background:var(--sky)}
.cmp td{padding:14px}
.cmp td .no{color:var(--muted)}
.cmp td:not(:first-child){font-size:17px}
.cmp td.big{font:700 34px Edge,sans-serif;white-space:nowrap}
.yr-line{margin:18px 0 0;font-size:15px}
@media (max-width:640px){table.cmp{min-width:700px;font-size:14px}.cmp col.c0{width:34%}.cmp td.big{font-size:26px}.cmp thead th{padding:14px 8px}.cmp thead th strong{font-size:20px;white-space:normal}.cmp td,.cmp tbody th{padding:12px 8px}.compare-hero h1{font-size:56px}}
.compare-band .shared-line{font-size:16px;font-weight:400;margin:10px 0 0}
/* fixed 16:10 tablet screen: the frame never resizes; tall screens sit top-aligned and scroll inside it (#2420) */
.demo-screen{aspect-ratio:16/10;min-height:0;overflow:hidden;position:relative}
.demo-screen .scrollbox{position:absolute;inset:0;overflow:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
.demo-screen .slide{width:100%;height:auto;min-height:0;object-fit:initial}
.demo-screen .live-estimate{min-height:100%;height:auto;overflow:visible}
.demo-screen .scrollbox:focus-visible{outline:2px solid var(--blue2);outline-offset:-2px}
@media (max-width:640px){.demo-screen .live-estimate .fine{padding-bottom:70px}}
/* header nav wraps on phones instead of hiding links (Compare pricing must stay reachable) */
@media (max-width:640px){header.top nav{flex-wrap:wrap;gap:6px 14px}}