/* V2 keeps the original Daypart desktop's materials and controls, not its OS layout. */
:root{
  --v2-ink:#26382d;
  --v2-muted:#415747;
  --v2-paper:#f5f3e9;
  --v2-sage:#a9ba9d;
  --v2-title:#cbdabf;
  --v2-border:#485e48;
  --v2-shadow:6px 6px 0 #42533b38;
}

body{color:var(--v2-ink);background:var(--v2-sage)}
/* One continuous wallpaper behind every page section; only content surfaces are solid. */
main{background-color:var(--v2-sage);background-image:radial-gradient(#829775 .6px,transparent .7px);background-size:5px 5px}
.hero,.proof-band,.integrations-strip,.product-section,.how-section,.audience-section,.comparison-section,.resources-section,.final-cta{background:transparent;border-top:0;border-bottom:0}
.shell{width:min(100% - 48px,1280px)}
.eyebrow{color:#3d5c43;font-size:11px;line-height:1.35;letter-spacing:.055em}
.button,.button-large{min-height:44px;border-color:#607d5d;border-radius:0;box-shadow:1px 1px 0 #fffdf299 inset,2px 2px 0 #60775c61;font-size:12px}
.button-green{border-color:#648c50;box-shadow:1px 1px 0 #e7ffc9 inset,2px 2px 0 #50714570}
.button:active:not(:disabled){transform:translate(1px,1px);box-shadow:1px 1px 1px #788a7277 inset}

/* A straightforward navigation bar with the same pressed-menu language as v5. */
.site-header{background:#e6e9dc;border-bottom:1px solid #75886f;box-shadow:0 1px 0 #fffdf0 inset,0 3px 0 #6c826333}
.nav-inner{height:61px;gap:17px}
.brand{gap:9px;font-size:20px;font-weight:750}
.brand img{width:32px;height:32px;border-color:#60775d}
.site-nav{justify-content:center;gap:4px;margin-left:0}
.site-nav a{display:inline-flex;align-items:center;min-height:38px;padding:8px 12px;border:1px solid transparent;border-radius:0;color:#2f4836;font-size:13px;font-weight:640}
.site-nav a:hover{border-color:#9db397;background:#d6e2ca}
.site-nav a[aria-current="location"]{border-color:#809d78;background:#cbdcbc;color:#213e2a;box-shadow:1px 1px 1px #718c6a8c inset}
.nav-signup{min-height:42px;padding-inline:15px;font-size:12px}

/* Hero copy and dashboard sit on the same continuous dotted wallpaper. */
.hero{background:transparent;border:0}
.hero:before{display:none}
.hero-grid{grid-template-columns:minmax(0,.39fr) minmax(0,.61fr);align-items:center;gap:36px;padding-block:69px 82px}
.hero h1{max-width:600px;font-size:clamp(45px,4.5vw,64px);font-weight:720;line-height:1.025;letter-spacing:-.056em}
.hero-lede{max-width:530px;margin-top:26px;color:#334b3a;font-size:17px;font-weight:470;line-height:1.56}
.hero-actions{gap:13px;margin-top:28px}
.hero-actions .primary-action,.hero-actions .button-outline{width:208px}
.hero-actions .button-large{min-height:50px;padding:10px 13px;font-size:14px}
.hero-actions .button-outline{border-color:#748e71;background:#fffef5;box-shadow:1px 1px 0 #fff inset,2px 2px 0 #60775c61}
.hero-actions .primary-action>span{color:#3b5340;font-size:11px}
.hero-dashboard{border-color:var(--v2-border);box-shadow:var(--v2-shadow)}
.hero-dashboard .window-bar{min-height:36px;background:var(--v2-title);border-bottom-color:#809478}
.hero-dashboard .window-caption{font-size:13px}
.hero-dash-main{background:#fffef7}
.hero-metrics>div{border-color:#aebfa7}
.hero-metrics strong{color:#376844}

/* Proof and platform logos use the original window proportions at a readable scale. */
.proof-band{padding:0 0 10px}
.proof-window-saas{border-color:var(--v2-border);box-shadow:var(--v2-shadow)}
.proof-window-saas>.window-bar{min-height:37px;background:var(--v2-title);border-bottom-color:#809478}
.proof-window-saas .proof-inner{grid-template-columns:255px 1fr}
.proof-window-saas .proof-intro{padding:16px 20px;background:#e6ebda}
.proof-intro h2{font-size:28px}
.proof-window-saas .proof-stats>div{padding:18px 24px;background:#f6f8ed}
.proof-stats strong{font-size:clamp(38px,4vw,56px);color:#315f3c}
.proof-stats span{color:#394e3e;font-size:13px}
.customer-grid-heading{min-height:34px;padding-inline:14px;color:#3b5540;font-size:10px}
.customer-logo-grid{gap:7px;padding:0 14px 14px}
.customer-logo-grid>div{min-height:54px;background:#fffef6;border-color:#b7c9b0;color:#546a55}
.customer-logo-grid svg{width:21px;height:21px}
.customer-logo-grid span{font-size:11px}
.integrations-strip{padding:12px 0 28px}
.integration-window{border-color:var(--v2-border);box-shadow:var(--v2-shadow)}
.integration-window-bar{min-height:37px;background:var(--v2-title);border-bottom-color:#809478}
.integration-window-bar h2{font-size:14px}
.integration-window-bar>div>span{color:#425a46;font-size:11px}
.integration-window-bar>span{color:#3f5844;font-size:9px}
.integration-viewport{padding:11px}
.integration-chip{height:45px;border-color:#a9bca3;background:#fffef6;color:#2e4435;font-size:12px}
.integration-disclosure{padding:2px 11px 9px;color:#3e5943;font-size:10px}

/* Keep the page spacious, but give every section a strong editorial hierarchy. */
.section{padding-block:82px 88px}
.section-heading{margin-bottom:32px}
.section-heading h2,.how-intro h2,.audience-intro h2,.comparison-intro h2{font-size:clamp(42px,4vw,55px);font-weight:700;line-height:1.07;letter-spacing:-.05em}
.section-heading p:not(.eyebrow),.how-intro>p:not(.eyebrow),.audience-intro>p:not(.eyebrow){max-width:660px;margin-top:16px;color:var(--v2-muted);font-size:16px;line-height:1.55}
.product-section{background:transparent;border-top:0}
.section-heading .inline-link{font-size:14px}
.value-story{gap:0;margin-bottom:30px;border:1px solid #8ca486;background:#e9eee0;box-shadow:4px 4px 0 #586d5340}
.value-story>div{min-height:143px;padding:22px 24px;border:0;border-right:1px solid #a8bfa2;background:transparent}
.value-story>div:last-child{border-right:0}
.value-story span{color:#3f6848;font-size:11px}
.value-story strong{margin-top:10px;font-size:19px}
.value-story p{margin-top:9px;color:#3d5642;font-size:14px;line-height:1.45}
.tour-wrap{border-color:var(--v2-border);box-shadow:var(--v2-shadow)}
.tour-heading{min-height:36px;background:var(--v2-title);color:#34533b;font-size:10px}
.tour-status{min-height:32px;color:#425a46;font-size:10px}
.tour-tabs{padding:8px 10px 0;background:#e7edde}
.tour-tabs button{min-height:44px;padding-inline:16px;border-color:#afbea9;background:#f6f7ed;color:#304b36;font-size:13px}
.tour-tabs button[aria-selected="true"]{border-color:#789276;background:#dcead4;color:#234b2d;box-shadow:1px 1px 1px #718c6a8c inset}
.tour-panel{padding:27px 29px;background:#fffef8}
.panel-topline h3{font-size:36px}
.panel-topline>div>p:not(.eyebrow){max-width:720px;color:#3f5543;font-size:15px;line-height:1.5}
.tour-metrics>div{border-color:#b5c7ae}
.tour-metrics span{font-size:13px}
.tour-metrics small{color:#465d49;font-size:10px}
.tour-table table{font-size:14px}
.tour-table th{color:#455c49;font-size:10px}
.tour-table td{font-size:13px}
.workspace-card-bar{min-height:37px;background:var(--v2-title);border-bottom-color:#809478}

/* The three steps read as one Daypart document, not three generic feature cards. */
.how-section{background:transparent;border:0}
.how-grid{grid-template-columns:.77fr 1.23fr;gap:66px}
.steps{border:1px solid var(--v2-border);background:#fffef7;box-shadow:var(--v2-shadow)}
.steps article{min-height:138px;margin:0;padding:25px 25px;border:0;border-bottom:1px solid #afc0a9;background:transparent;grid-template-columns:33px 47px 1fr;gap:16px}
.steps article:last-child{border-bottom:0}
.steps h3{font-size:24px}
.steps article div>p:last-child{max-width:570px;color:#405845;font-size:14px;line-height:1.5}
.step-number{color:#44634b;font-size:12px}
.autopilot-panel{margin-top:32px;border-color:var(--v2-border);box-shadow:var(--v2-shadow)}
.autopilot-bar{min-height:37px;background:var(--v2-title)}
.autopilot-content{padding:29px 31px}
.autopilot-content h3{font-size:34px}
.autopilot-content p:not(.eyebrow){color:var(--v2-muted);font-size:15px;line-height:1.55}

/* Separate cards make each audience easier to scan without changing the copy. */
.audience-section{background:transparent;border:0}
.audience-list{gap:19px;margin-top:42px;border:0}
.audience-list article,.audience-list article:first-child{min-height:250px;padding:28px 30px;border:1px solid var(--v2-border);background:#fffef7;box-shadow:4px 4px 0 #42533b33}
.audience-list article:last-child{border-right:1px solid var(--v2-border)}
.audience-list article>span{color:#4f6d54;font-size:11px}
.audience-list .icon-step{width:54px;height:54px;margin-top:22px}
.audience-list h3{font-size:27px}
.audience-list p{color:var(--v2-muted);font-size:15px;line-height:1.5}

/* A two-column buyer table with a clear, high-contrast Daypart side. */
.comparison-section{background:transparent;border:0}
.comparison-intro{max-width:1010px;margin-bottom:31px}
.comparison-intro h2{font-size:clamp(43px,4.15vw,58px)}
.comparison-matrix{border-color:var(--v2-border);box-shadow:var(--v2-shadow)}
.comparison-matrix-bar{min-height:38px;background:var(--v2-title);border-bottom-color:#809478}
.comparison-matrix-bar span{font-size:13px}
.comparison-matrix thead th{padding:19px 29px;background:#f3f3e9;color:#273e2e;font-size:13px}
.comparison-matrix thead th+th{background:#c7e0ba;color:#204a2b;box-shadow:inset 0 4px 0 #5b9b53}
.comparison-matrix tbody tr:nth-child(even){background:#f7f7ef}
.comparison-matrix tbody td{padding:20px 29px;border-bottom-color:#b5c6af;color:#304b36;font-size:18px;line-height:1.35}
.comparison-matrix tbody td:first-child{color:#3d5341}
.comparison-matrix tbody td+td{border-left-color:#9ebc96;background:#e3f0da;color:#245430}
.comparison-matrix tbody tr:nth-child(even) td+td{background:#d9ebce}

/* Resources keep their title bars and behave like readable editorial objects. */
.resources-section{background:transparent;border:0}
.resource-grid{gap:18px}
.resource-card{border-color:var(--v2-border);background:#fffef7;box-shadow:var(--v2-shadow)}
.resource-card:hover{box-shadow:var(--v2-shadow)}
.resource-top{min-height:42px;background:var(--v2-title);border-bottom-color:#809478}
.resource-top>span{color:#35533d;font-size:11px}
.resource-card>.resource-content{padding:25px!important}
.resource-card h3{font-size:31px}
.resource-card p{color:var(--v2-muted);font-size:15px;line-height:1.55}
.resource-card-footer{min-height:42px;background:#e9eee2;border-top-color:#b5c7ae}
.resource-card-footer span{color:#47604d;font-size:10px}
.resource-card-footer a,.issue-copy>a{color:#245c34;font-size:12px}
.issue-preview{border-color:#aebfa9;background:#fffef9;box-shadow:4px 4px 0 #42533b33}
.issue-copy>span,.issue-copy>small{color:#456449;font-size:10px}
.issue-copy h4{font-size:20px}
.issue-copy p{color:#405745;font-size:13px}
.spotify-frame{border-color:#a9bea3}
.spotify-fallback{background:#e0ebd9}
.spotify-fallback span{color:#3f6249;font-size:11px}
.spotify-fallback strong{font-size:25px}
.field-note{background:#e6f0df;border-color:#a9c6a1}
.field-note>span{color:#3d6a46;font-size:10px}
.field-note strong{font-size:24px}
.field-note p{color:#405b44;font-size:14px}

.final-cta{background:#284634;border-top:1px solid #1b3826;color:#f8f8ed}
.final-inner{padding-block:76px}
.final-inner h2{font-size:clamp(43px,4.5vw,63px)}
.final-cta .eyebrow-light{color:#c5dfa9}
.final-lede{color:#e1ead9;font-size:16px;line-height:1.55}
.final-checklist li{color:#ecf4e6;font-size:13px}
.final-checklist li:before{border-color:#658f53;background:#a4d979;color:#21432a}
.final-actions>span{color:#d5e8c8}
.final-actions>a{color:#e1f2d6}
.site-footer{background:#e5e9dc}
.footer-inner{color:#405846;font-size:13px}

@media(max-width:1100px){
  .hero-grid{grid-template-columns:minmax(0,.42fr) minmax(0,.58fr);gap:24px}
  .hero h1{font-size:clamp(43px,4.7vw,58px)}
  .hero-actions .primary-action,.hero-actions .button-outline{width:190px}
  .hero-actions .button-large{font-size:12px}
}
@media(max-width:900px){
  .shell{width:min(100% - 36px,1280px)}
  .site-nav{justify-content:stretch;margin:0;background:#e6e9dc}
  .site-nav a{min-height:48px;font-size:14px}
  .hero-grid{grid-template-columns:1fr;gap:0;padding-block:0 48px}
  .hero-copy{max-width:none;margin-inline:0;padding:49px 0 40px;background:transparent;border-bottom:0}
  .hero h1{max-width:700px;font-size:clamp(49px,6.3vw,65px)}
  .hero-lede{max-width:650px}
  .hero-visual{width:100%;max-width:none;margin-top:34px}
  .proof-window-saas .proof-inner{grid-template-columns:1fr}
  .proof-window-saas .proof-intro{border-right:0;border-bottom:1px solid #b9cbb1}
  .how-grid{grid-template-columns:1fr;gap:28px}
  .how-intro{position:static}
}
@media(max-width:650px){
  .shell{width:min(100% - 28px,1280px)}
  .nav-inner{height:62px;gap:7px}
  .brand{gap:6px;font-size:17px}
  .brand img{width:29px;height:29px}
  .nav-signup,.menu-toggle{min-height:44px}
  .nav-signup{max-width:119px;padding:6px 8px;font-size:10px}
  .menu-toggle{padding:7px 8px;font-size:11px}
  .hero-grid{padding-bottom:28px}
  .hero-copy{margin-inline:0;padding:39px 0 34px;border-bottom:0;background:transparent}
  .hero h1{font-size:clamp(40px,10.2vw,50px);line-height:1.025}
  .hero-lede{margin-top:18px;color:#304736;font-size:16px;line-height:1.52}
  .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;margin-top:23px}
  .hero-actions .primary-action,.hero-actions .button-outline{width:100%}
  .hero-actions .button-large,.hero-actions .button-outline{min-height:46px;padding:8px 9px;font-size:12px}
  .hero-actions .primary-action>span{font-size:10px}
  .hero-visual{margin-top:25px}
  .hero-dashboard .window-bar{min-height:34px}
  .hero-dash-main{padding:12px}
  .hero-dash-heading h2{font-size:21px}
  .hero-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .hero-metrics>div{min-height:91px;padding:9px}
  .hero-metrics span{font-size:10px}
  .hero-metrics strong{font-size:27px}
  .hero-metrics small{font-size:8px}
  .hero-metrics>div:last-child{grid-column:1/-1;min-height:63px;display:grid;grid-template-columns:1fr auto;align-items:center;column-gap:8px}
  .hero-metrics>div:last-child span{grid-column:1;grid-row:1}
  .hero-metrics>div:last-child strong{grid-column:2;grid-row:1/3}
  .hero-metrics>div:last-child small{grid-column:1;grid-row:2}
  .hero-dash-lower{grid-template-columns:1fr;gap:6px}
  .signal-card,.risk-card{min-height:104px;padding:11px}
  .signal-card small,.risk-card small{font-size:9px}
  .signal-card strong{font-size:13px}
  .signal-card>span,.risk-card>div{font-size:10px}
  .proof-band{padding-bottom:8px}
  .proof-window-saas>.window-bar{min-height:35px}
  .proof-window-saas .proof-stats>div{padding:15px 9px}
  .proof-stats strong{font-size:clamp(30px,9vw,43px)}
  .proof-stats span{font-size:10px}
  .customer-grid-heading{font-size:9px}
  .customer-logo-grid{gap:5px;padding:0 9px 9px}
  .customer-logo-grid>div{min-height:51px}
  .customer-logo-grid span{font-size:9px}
  .integrations-strip{padding:9px 0 20px}
  .integration-window-bar{min-height:34px}
  .integration-window-bar h2{font-size:12px}
  .integration-viewport{padding:8px}
  .integration-chip{height:42px;font-size:10px}
  .integration-disclosure{font-size:9px}
  .section{padding-block:66px 71px}
  .section-heading h2,.how-intro h2,.audience-intro h2,.comparison-intro h2{font-size:clamp(36px,9.1vw,48px)}
  .section-heading p:not(.eyebrow),.how-intro>p:not(.eyebrow),.audience-intro>p:not(.eyebrow){font-size:15px}
  .value-story{grid-template-columns:1fr}
  .value-story>div{min-height:0;padding:18px;border:0;border-bottom:1px solid #a8bfa2}
  .value-story>div:last-child{border-bottom:0}
  .value-story strong{font-size:17px}
  .value-story p{font-size:14px}
  .tour-heading,.tour-status{font-size:9px}
  .tour-tabs button{min-height:44px;padding:7px 4px;font-size:10px}
  .tour-panel{padding:18px 14px}
  .panel-topline h3{font-size:29px}
  .panel-topline>div>p:not(.eyebrow){font-size:14px}
  .tour-metrics{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px}
  .tour-metrics>div{min-height:103px;padding:10px}
  .tour-metrics span{font-size:11px}
  .tour-metrics small{font-size:9px}
  .tour-metrics>div:last-child{grid-column:1/-1;min-height:78px}
  .tour-table td{font-size:11px}
  .steps article{grid-template-columns:27px 38px 1fr;gap:9px;padding:22px 14px}
  .steps h3{font-size:21px}
  .steps article div>p:last-child{font-size:13px}
  .autopilot-content{padding:19px}
  .autopilot-content h3{font-size:28px}
  .autopilot-content p:not(.eyebrow){font-size:14px}
  .audience-list{display:grid;grid-template-columns:1fr;gap:14px;margin-top:31px}
  .audience-list article,.audience-list article:first-child{display:grid;grid-template-columns:45px 1fr;column-gap:13px;min-height:0;padding:21px;border:1px solid var(--v2-border);background:#fffef7}
  .audience-list article:last-child{border-bottom:1px solid var(--v2-border)}
  .audience-list article>span{grid-column:1/-1}
  .audience-list .icon-step{grid-column:1;grid-row:2/4;width:43px;height:43px;margin-top:13px}
  .audience-list h3{grid-column:2;margin-top:11px;font-size:24px}
  .audience-list p{grid-column:2;font-size:14px}
  .comparison-intro{margin-bottom:23px}
  .comparison-matrix-bar{min-height:36px}
  .comparison-matrix-bar span{font-size:11px}
  .comparison-matrix tbody td{min-height:96px;padding:15px 12px;font-size:14px;line-height:1.35}
  .comparison-matrix tbody td:before{color:#3f5e46;font-size:9px}
  .comparison-matrix tbody td+td:before{color:#30633c}
  .resource-grid{gap:14px}
  .resource-top{min-height:39px}
  .resource-top>span{font-size:10px}
  .resource-card>.resource-content{padding:20px!important}
  .resource-card h3{font-size:27px}
  .resource-card p{font-size:14px}
  .resource-card-footer{gap:12px;padding:11px}
  .resource-card-footer span{font-size:9px}
  .issue-preview{grid-template-columns:1fr;gap:0}
  .issue-art{min-height:185px}
  .issue-copy{padding:17px}
  .issue-copy h4{font-size:19px}
  .issue-copy p{font-size:13px}
  .spotify-fallback{flex-direction:column;align-items:flex-start;gap:10px;min-height:0;padding:18px}
  .spotify-fallback .icon-large{width:48px;height:48px}
  .spotify-fallback strong{font-size:22px}
  .field-note strong{font-size:21px}
  .field-note p{font-size:13px}
  .final-inner{padding-block:65px}
  .final-inner h2{font-size:clamp(37px,9vw,49px)}
  .final-lede{font-size:15px}
  .final-checklist li{font-size:12px}
}
@media(max-width:360px){
  .hero h1{font-size:37px}
  .hero-actions .button-large,.hero-actions .button-outline{font-size:10px}
  .hero-metrics strong{font-size:23px}
  .comparison-matrix tbody td{font-size:13px}
}
@media(prefers-reduced-motion:reduce){
  .button,.resource-card{transition:none}
}

/* Give each product capability its own editorial beat instead of a four-card inventory. */
.workspace-flow{margin-top:66px}
.flow-feature{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:clamp(34px,5.2vw,82px);padding:70px 0;border-top:1px solid #96af94}
.flow-feature:last-child{padding-bottom:20px}
.flow-feature-reverse{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr)}
.flow-feature-reverse .flow-copy{grid-column:2;grid-row:1}
.flow-feature-reverse .flow-visual{grid-column:1;grid-row:1}
.flow-copy{min-width:0;max-width:510px}
.flow-copy .eyebrow{color:#3e6a47}
.flow-copy h3{margin-top:17px;font-size:clamp(37px,3.8vw,53px);font-weight:700;letter-spacing:-.052em;line-height:1.06}
.flow-copy>p:not(.eyebrow){max-width:495px;margin-top:20px;color:#405b48;font-size:17px;line-height:1.55}
.flow-copy>small{display:block;max-width:480px;margin-top:24px;color:#344f3c;font:11px/1.55 var(--mono)}
.flow-visual{min-width:0;border:1px solid var(--v2-border);background:#f8f9f0;box-shadow:6px 6px 0 #42533b33}
.flow-visual .workspace-card-bar{min-height:39px;padding:6px 12px;background:var(--v2-title);border-bottom-color:#809478}
.flow-visual .workspace-card-bar>span:last-child{color:#526d55;font-size:9px}
.flow-visual-body{min-width:0;padding:26px;background:#edf3e8}
.coverage-visual{display:flex;align-items:stretch;min-height:330px}
.coverage-visual .coverage-columns{width:100%;margin:0;gap:14px}
.coverage-visual .coverage-columns>div{align-content:start;gap:10px;min-height:276px;padding:24px;border-color:#aec4a9;background:#fffef8;box-shadow:3px 3px 0 #cedbc8}
.coverage-visual .coverage-columns strong{padding-bottom:14px;color:#2e593b;font-size:17px}
.coverage-visual .coverage-columns span{font-size:14px}
.report-visual{display:grid;place-items:center;min-height:430px;background-color:#e6eee0;background-image:radial-gradient(#c5d3bf .7px,transparent .7px);background-size:10px 10px}
.report-visual .report-sheet{width:min(100%,520px);max-width:none;margin:0;padding:23px 26px;background:#fffef8;border-color:#aabda6;box-shadow:7px 7px 0 #aabbab66}
.report-visual .report-sheet-title{max-width:420px;margin:18px 0;font-size:23px}
.report-visual .report-sheet-totals{gap:10px;margin-bottom:14px}
.report-visual .report-sheet-totals>div{padding:12px}
.report-visual .report-sheet-totals strong{font-size:27px}
.report-visual .report-sheet-totals span{font-size:9px}
.report-visual .report-sheet-row{padding:8px 0;font-size:12px}
.monitoring-visual{padding:21px 23px 23px}
.monitoring-visual .sample-account{margin:0;padding:11px;background:#fffef8}
.activity-heading{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-top:24px}
.activity-heading span{color:#58745c;font:10px var(--mono)}
.activity-heading strong{font-size:17px;letter-spacing:-.03em}
.monitoring-visual .activity-list{margin-top:12px;background:#fffef8}
.monitoring-visual .activity-list li{min-height:62px;padding:11px 13px}
.monitoring-visual .activity-list strong{font-size:13px}
.monitoring-visual .activity-list small{font-size:10px}
.monitoring-visual .activity-foot{margin-top:10px;font-size:9px}
.monitoring-visual .bad-traffic-note{margin-top:20px;background:#f8fbf4}
.flow-copy .setup-list{gap:11px;margin:25px 0 0}
.flow-copy .setup-list li{align-items:flex-start;color:#3e5946;font-size:15px;line-height:1.35}
.flow-copy .setup-list li:before{font-size:17px}

@media(max-width:900px){
  .workspace-flow{margin-top:50px}
  .flow-feature,.flow-feature-reverse{grid-template-columns:1fr;gap:28px;padding:53px 0}
  .flow-feature-reverse .flow-copy{grid-column:1;grid-row:1}
  .flow-feature-reverse .flow-visual{grid-column:1;grid-row:2}
  .flow-copy{max-width:650px}
  .flow-copy h3{font-size:clamp(35px,5.5vw,49px)}
  .flow-copy>p:not(.eyebrow){font-size:16px}
}
@media(max-width:650px){
  .workspace-flow{margin-top:41px}
  .flow-feature,.flow-feature-reverse{gap:22px;padding:43px 0}
  .flow-copy h3{margin-top:11px;font-size:clamp(31px,8vw,39px)}
  .flow-copy>p:not(.eyebrow){margin-top:13px;font-size:15px}
  .flow-copy>small{margin-top:15px;font-size:11px}
  .flow-visual .workspace-card-bar>span:last-child{font-size:8px}
  .flow-visual-body{padding:14px}
  .coverage-visual{min-height:0}
  .coverage-visual .coverage-columns{gap:9px}
  .coverage-visual .coverage-columns>div{min-height:0;padding:14px}
  .coverage-visual .coverage-columns strong{font-size:14px}
  .coverage-visual .coverage-columns span{font-size:12px}
  .report-visual{min-height:0;padding:21px}
  .report-visual .report-sheet{padding:17px}
  .report-visual .report-sheet-title{font-size:19px}
  .report-visual .report-sheet-totals strong{font-size:22px}
  .report-visual .report-sheet-row{font-size:10px}
  .monitoring-visual{padding:15px}
  .activity-heading{display:block;margin-top:19px}
  .activity-heading strong{display:block;margin-top:5px}
  .monitoring-visual .activity-list li{grid-template-columns:32px 60px minmax(0,1fr);gap:7px;padding:9px}
  .monitoring-visual .activity-list strong{font-size:11px}
  .monitoring-visual .activity-list small{font-size:9px}
  .flow-copy .setup-list{gap:8px;margin-top:17px}
  .flow-copy .setup-list li{font-size:13px}
}
@media(max-width:460px){
  .coverage-visual .coverage-columns{grid-template-columns:1fr}
  .flow-visual .workspace-card-bar>span:last-child{display:none}
  .monitoring-visual .sample-account em{font-size:7px}
}

/* The product-tour choices sit outside the sample window and read as controls. */
#how-it-works{padding-top:49px;border-top:1px solid #96af94;scroll-margin-top:82px}
.tour-picker{margin:0 0 27px}
.tour-picker>.eyebrow{margin-bottom:12px;color:#315d3c}
.tour-picker .tour-tabs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px;padding:0;border:0;background:transparent}
.tour-picker .tour-tabs button{display:flex;flex-direction:column;align-items:stretch;min-width:0;min-height:138px;padding:16px 18px 14px;border:1px solid #526c55;background:#fffef7;box-shadow:4px 4px 0 #42533b40;color:#283e2e;text-align:left;cursor:pointer;transition:transform .16s ease,box-shadow .16s ease,background .16s ease}
.tour-picker .tour-tabs button:hover{transform:translateY(-2px);background:#f3f8ee;box-shadow:4px 6px 0 #42533b40}
.tour-picker .tour-tabs button:focus-visible{outline:3px solid #27693a;outline-offset:4px}
.tour-picker .tour-tabs button[aria-selected="true"]{top:0;transform:translate(2px,2px);border-color:#4f7453;background:#dcebd3;box-shadow:inset 2px 2px 0 #9fb99a,2px 2px 0 #42533b40;color:#1f3e2a}
.tour-tab-number{color:#4c7053;font:700 11px var(--mono)}
.tour-tab-name{display:flex;align-items:center;gap:11px;min-width:0;margin-top:11px}
.tour-tab-name .icon-step{width:33px;height:33px;flex:none}
.tour-tab-name strong{font-size:20px;line-height:1.2}
.tour-tab-action{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;padding-top:11px;border-top:1px solid #c2d0bb;color:#356442;font:700 11px var(--mono)}
.tour-tab-action .icon-small{width:17px;height:17px;flex:none}
.tour-picker .tour-tabs button[aria-selected="true"] .tour-tab-action .icon-small{transform:rotate(90deg)}

@media(max-width:650px){
  #how-it-works{padding-top:37px;scroll-margin-top:73px}
  .tour-picker{margin-bottom:22px}
  .tour-picker .tour-tabs{grid-template-columns:1fr;gap:10px}
  .tour-picker .tour-tabs button{display:grid;grid-template-columns:26px minmax(0,1fr) auto;align-items:center;gap:11px;min-height:72px;padding:10px 14px}
  .tour-tab-number{font-size:10px}
  .tour-tab-name{gap:8px;margin:0}
  .tour-tab-name .icon-step{width:27px;height:27px}
  .tour-tab-name strong{font-size:16px}
  .tour-tab-action{gap:5px;margin:0;padding:0;border:0;font-size:10px;white-space:nowrap}
}
@media(max-width:360px){
  .tour-picker .tour-tabs button{gap:8px;padding-inline:10px}
  .tour-tab-name strong{font-size:14px}
  .tour-tab-action [data-tour-action]{display:none}
}
@media(prefers-reduced-motion:reduce){
  .tour-picker .tour-tabs button{transition:none}
}