/* Approved TOP refinement, 2026-09-13.
 * Loaded only on TOP, after the shared layout styles. Product pages and the
 * shared header/footer are intentionally excluded. Existing motion is retained.
 */
.home-refined {
  --r-body: 1rem;
  --r-heading: clamp(1.5rem, 2.6vw, 2.15rem);
  --r-space: clamp(44px, 6vw, 76px);
}
.home-refined .r-phrase { display:inline-block; max-width:100%; }
.home-refined .r-line { display:block; }
.home-refined main h1,
.home-refined main h2 { letter-spacing:.035em; line-height:1.55; text-wrap:initial; }
.home-refined main p { text-wrap:pretty; }
.home-refined .v3-intro-summary > p:not(.v3-hero-reading) { font-size:1rem; line-height:1.9; }
.home-refined .v3-quick-facts article { gap:10px; align-items:flex-start; }
.home-refined .v3-quick-facts b { font-size:.875rem; }
.home-refined .v3-quick-facts p { font-size:.8125rem!important; line-height:1.6!important; }
.home-refined .v3-quick-facts b > span { font-size:.75rem; }

/* A compact explanatory diagram, not a rendered stationery scene. */
.home-refined .v3-what-we-make { padding:44px 0 48px; background:var(--v3-paper); }
.home-refined .v3-what-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:48px; }
.home-refined .v3-what-copy { padding:0; max-width:none; width:auto; }
.home-refined .v3-what-copy:before { display:none; }
.home-refined .v3-what-kicker { margin-bottom:16px!important; font-size:.875rem!important; }
.home-refined .v3-what-kicker > span { display:none; }
.home-refined .v3-what-copy h2 { font-size:var(--r-heading); margin-bottom:20px; }
.home-refined .v3-what-copy > p:not(.v3-what-kicker) { font-size:var(--r-body); line-height:1.85; color:#34463e; }
.home-refined .v3-what-copy > p:not(.v3-what-kicker) br { display:none; }
.r-tool-diagram { display:grid; grid-template-columns:minmax(0,.8fr) 36px minmax(0,1.2fr); align-items:center; gap:18px; color:var(--v3-green); }
.r-tool-diagram svg { fill:none; stroke:currentColor; stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; }
.r-tool-diagram small { display:block; margin-top:18px; font-size:.8125rem; font-weight:700; line-height:1.6; text-align:center; letter-spacing:0; }
.r-tool-symbols { display:flex; height:126px; align-items:center; justify-content:center; gap:20px; }
.r-tool-symbols svg { width:44px; height:44px; }
.r-tool-symbols svg:last-child { fill:#fff1bf; }
.r-tool-arrow { width:36px; height:24px; margin-bottom:36px; }
.r-browser-diagram { height:126px; overflow:hidden; border:1px solid #9cbbb0; border-radius:8px; background:#fff; }
.r-browser-toolbar { display:flex; align-items:center; gap:5px; height:25px; padding:0 11px; border-bottom:1px solid #dce7e1; }
.r-browser-toolbar span { width:4px; height:4px; border-radius:50%; background:#9cbbb0; }
.r-browser-functions { display:flex; height:99px; align-items:center; justify-content:center; gap:20px; }
.r-browser-functions svg { width:27px; height:27px; }

/* Product count is open-ended; retain the existing two-column/list breakpoints. */
.home-refined .v3-products { padding:var(--r-space) 0; background:#fff; }
.home-refined .v3-products-lead { margin-bottom:36px; padding:0; }
.home-refined .v3-products-lead h2 { font-size:var(--r-heading); }
.home-refined .v3-products-index { margin-top:20px; font-size:.875rem; line-height:1.4; }
.home-refined .v3-products-index > span { font-size:.75rem; }
.home-refined .v3-product-card { padding:28px 24px 22px; box-shadow:0 6px 20px rgba(34,48,41,.04); }
.home-refined .v3-product-card:hover { box-shadow:0 14px 26px rgba(34,48,41,.09); }
.home-refined .v3-product-copy { overflow-wrap:normal; }
.home-refined .v3-product-category { font-size:.8125rem; margin-bottom:14px; }
.home-refined .v3-product-pain { font-size:.9375rem; line-height:1.7; font-weight:400; }
.home-refined .v3-product-copy h3 { margin:16px 0 9px; padding:0; border:0; font-size:1.5rem; }
.home-refined .v3-product-value { font-size:1rem; line-height:1.75; }
.home-refined .v3-product-definition { margin:10px 0 0; font-size:1rem; line-height:1.85; color:#46554d; }
.home-refined .v3-card-link { min-height:44px; display:flex; justify-content:center; align-items:center; gap:10px; font-size:.9375rem; }

/* Three paragraphs of explanation, with one quiet official Chrome mark. */
.home-refined .v3-extension-guide { padding:var(--r-space) 0; background:#f1f5f2; }
.home-refined .v3-extension-guide-grid { grid-template-columns:minmax(0,1fr) minmax(0,1.08fr); gap:64px; }
.home-refined .v3-extension-guide h2 { font-size:clamp(1.5rem,2.25vw,2rem); word-break:normal; max-width:none; }
.r-chrome-sign { display:flex; align-items:center; gap:12px; margin-top:28px; color:#40534a; font-size:1rem; }
.r-chrome-sign img { display:block; width:36px; height:36px; }
.home-refined .v3-extension-lead > small { margin-top:20px; color:#4d6056; font-size:.8125rem; line-height:1.65; }
.r-guide-copy { font-size:1rem; line-height:1.9; color:#34463e; }
.r-guide-group + .r-guide-group { margin-top:24px; padding-top:24px; border-top:1px solid #cbdad1; }
.r-guide-group p { margin:0; }
.r-guide-group p + p { margin-top:16px; }
.r-guide-copy strong { color:var(--v3-deep); font-weight:700; }

/* Origin is an introduction to the principles, not a second hero before products. */
.home-refined .r-guide-layout { max-width:960px; }
.home-refined .r-guide-layout h2 { font-size:var(--r-heading); text-align:center; }
.r-guide-introduction { margin:22px 0 0; font-size:1rem; line-height:1.85; text-align:center; color:#34463e; }
.r-comparison { display:grid; grid-template-columns:1fr 1fr; gap:48px; max-width:640px; margin:32px auto; }
.r-comparison-stage { height:170px; display:flex; align-items:center; justify-content:center; }
.r-comparison-side > p { margin:16px 0 0; text-align:center; font-size:.875rem; color:#34463e; }
.r-comparison-side > p > span { display:block; margin-top:4px; color:var(--v3-deep); font-size:1.125rem; font-weight:700; }
.r-phone-ui { position:relative; box-sizing:border-box; width:100px; height:164px; padding:28px 14px; border:2px solid #597c6d; border-radius:15px; background:#fff; }
.r-phone-speaker { position:absolute; width:26px; height:3px; top:10px; left:35px; border-radius:3px; background:#a6bbb1; }
.r-app-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.r-app-grid > i { height:28px; background:#e4ece7; border-radius:6px; }
.r-phone-home { position:absolute; bottom:10px; left:31px; width:34px; height:3px; border-radius:3px; background:#a6bbb1; }
.r-added-tile { display:flex; align-items:center; justify-content:center; box-sizing:border-box; border:1.5px dashed var(--v3-green); border-radius:6px; background:#fff4ce!important; color:var(--v3-green); font-family:Arial,sans-serif; font-size:22px; font-style:normal; line-height:1; }
.r-desktop-ui { width:260px; height:154px; overflow:hidden; border:2px solid #597c6d; border-radius:9px; background:#fff; }
.r-desktop-toolbar { display:flex; height:38px; padding:0 12px; gap:10px; align-items:center; border-bottom:1px solid #d6e2da; }
.r-desktop-toolbar img { width:20px; height:20px; }
.r-desktop-toolbar > i { flex:1; height:8px; border-radius:3px; background:#e4ece7; }
.r-desktop-toolbar .r-added-tile { width:27px; height:27px; }
.r-desktop-content { padding:22px 20px; display:flex; gap:16px; align-items:center; }
.r-desktop-content > div { width:52px; height:54px; background:#eaf0ec; border-radius:3px; }
.r-desktop-content > p { flex:1; margin:0; }
.r-desktop-content i { display:block; height:6px; margin:0 0 10px; border-radius:2px; background:#eaf0ec; }
.r-desktop-content i:nth-child(2) { width:80%; }
.r-desktop-content i:last-child { width:60%; margin-bottom:0; }
.r-guide-definition { max-width:700px; margin:auto; color:#34463e; font-size:1rem; line-height:1.9; }
.r-guide-definition p { margin:0; }
.r-guide-definition p + p { margin-top:14px; }
.r-guide-definition strong { display:inline-block; color:var(--v3-deep); font-size:1.125rem; }
.r-guide-usecases { display:grid; grid-template-columns:1fr 1fr; gap:32px; max-width:700px; margin:28px auto; }
.r-guide-usecases > p { margin:0; padding:2px 0 2px 18px; border-left:2px solid var(--v3-green); color:#34463e; font-size:1rem; line-height:1.8; }
.r-guide-usecases strong { color:var(--v3-deep); font-size:1.125rem; }
.r-guide-closing { max-width:700px; margin:32px auto 0; padding-top:24px; border-top:1px solid #cbdad1; color:#34463e; }
.r-guide-closing p { margin:0; font-size:1rem; line-height:1.9; }
.r-guide-closing small { display:block; margin-top:16px; font-size:.8125rem; line-height:1.65; color:#4d6056; }
@media(max-width:560px) {
  .home-refined .r-guide-layout { width:calc(100% - 40px); }
  .home-refined .r-guide-layout h2 { text-align:left; font-size:clamp(1.2rem,5.1vw,1.65rem); }
  .r-guide-introduction { margin-top:18px; text-align:left; }
  .r-comparison { gap:18px; grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr); margin:26px auto; }
  .r-comparison-stage { height:130px; }
  .r-phone-ui { width:76px; height:126px; padding:24px 10px; border-radius:12px; }
  .r-phone-speaker { left:24px; width:24px; }
  .r-app-grid { gap:6px; }
  .r-app-grid > i { height:23px; }
  .r-phone-home { left:23px; width:26px; }
  .r-desktop-ui { width:100%; height:112px; }
  .r-desktop-toolbar { height:30px; padding:0 8px; gap:6px; }
  .r-desktop-toolbar img { width:16px; height:16px; }
  .r-desktop-toolbar .r-added-tile { width:22px; height:22px; font-size:18px; }
  .r-desktop-content { padding:16px 10px; gap:10px; }
  .r-desktop-content > div { width:32px; height:40px; }
  .r-comparison-side > p { font-size:.8125rem; margin-top:12px; }
  .r-comparison-side > p > span { font-size:1rem; }
  .r-guide-usecases { grid-template-columns:1fr; gap:16px; }
  .r-guide-usecases br { display:none; }
  .r-guide-usecases strong { font-size:1rem; }
}

.home-refined .v3-philosophy { padding:0; }
.home-refined .v3-philosophy-hero { padding:var(--r-space) 0; background:var(--v3-deep); }
.home-refined .v3-philosophy-hero:after { display:none; }
.r-origin { display:grid; grid-template-columns:minmax(0,1fr) 116px; gap:40px; align-items:center; padding-bottom:40px; margin-bottom:48px; border-bottom:1px solid rgba(255,255,255,.24); }
.r-origin-kicker { margin:0 0 12px; color:#fff; font-size:.875rem; font-weight:700; }
.home-refined .r-origin h2 { margin:0 0 14px; font-size:clamp(1.4rem,2.2vw,1.8rem); color:#fff; }
.home-refined .r-origin p:not(.r-origin-kicker) { margin:0; max-width:48em; color:#e2ede8; font-size:1rem; line-height:1.9; }
.home-refined .r-origin .v3-philosophy-dog { position:relative; inset:auto; display:block; width:116px; height:116px; margin:0; border:5px solid #fff; box-shadow:none; }
.home-refined .v3-philosophy-hero-grid { grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr); gap:64px; }
.home-refined .v3-philosophy-title { min-height:0; }
.home-refined .v3-philosophy-title h2 { font-size:clamp(1.65rem,2.8vw,2.4rem); line-height:1.65; }
.home-refined .v3-philosophy-copy { margin:0; padding:0; font-size:1rem; line-height:1.9; }
.home-refined .v3-philosophy-opening { color:#e2ede8; margin-bottom:12px!important; }
.home-refined .v3-philosophy-pains { gap:0; margin-bottom:16px; }
.home-refined .v3-philosophy-pains li { padding:12px 0; min-height:0; grid-template-columns:38px minmax(0,1fr); border-bottom:1px solid rgba(255,255,255,.22); border-radius:0; background:none; color:#fff; font-size:1rem; line-height:1.65; }
.home-refined .v3-philosophy-pains b { font-size:.8125rem; font-weight:400; color:#d4e6dd; }
.home-refined .v3-philosophy-close { padding:0; margin-bottom:24px!important; border:0; }
.home-refined .v3-philosophy-statement { padding:0; border:0; margin-top:16px!important; font-weight:400; }
.home-refined .v3-philosophy-principles { padding:44px 0 var(--r-space); }
.home-refined .v3-principles article { padding:28px 20px; box-shadow:none; border-color:#e1e4dc; }
.home-refined .v3-principles h3 { font-size:1rem; line-height:1.7; text-wrap:balance; }
.home-refined .v3-principles p { font-size:1rem; line-height:1.85; color:#46554d; }
.home-refined .v3-principles p br { display:none; }

/* Free: a pause in the narrative, not another decorative scene. */
.home-refined .v3-free { display:block; min-height:0; padding:48px 24px; background:#f1f5f2; }
.home-refined .v3-free > div { max-width:760px; margin:auto; }
.home-refined .v3-free h2 { margin:0 0 22px; font-size:var(--r-heading); white-space:normal; }
.home-refined .v3-free p { margin:0 auto; max-width:43em; color:#46554d; font-size:1rem; line-height:1.9; }
.home-refined .v3-free p + p { margin-top:16px; }
.home-refined .v3-cta h2 { font-size:var(--r-heading); }
.home-refined .v3-cta p:not(.v3-kicker) { font-size:1rem; line-height:1.85; }

@media (max-width:1000px) {
  .home-refined .v3-what-grid { grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:32px; }
  .r-tool-diagram { gap:10px; grid-template-columns:minmax(0,.75fr) 24px minmax(0,1.25fr); }
  .r-tool-symbols { gap:10px; }
  .r-tool-symbols svg { width:34px; height:34px; }
  .r-tool-arrow { width:24px; }
  .r-browser-functions { gap:12px; }
  .r-browser-functions svg { width:24px; height:24px; }
  .home-refined .v3-extension-guide-grid,
  .home-refined .v3-philosophy-hero-grid { gap:36px; }
}
@media (max-width:800px) {
  .home-refined .v3-what-grid,
  .home-refined .v3-extension-guide-grid,
  .home-refined .v3-philosophy-hero-grid { grid-template-columns:1fr; gap:28px; }
  .r-tool-diagram { width:min(460px,100%); margin:0 auto; }
  .home-refined .v3-principles { grid-template-columns:1fr; }
  .home-refined .v3-principles article { text-align:left; display:grid; grid-template-columns:50px minmax(0,1fr); column-gap:20px; }
  .home-refined .v3-principle-icon { grid-row:1/3; margin:0; }
  .home-refined .v3-principles h3 { margin:0 0 8px; text-wrap:initial; }
  .home-refined .v3-principles p { grid-column:2; }
}
@media (max-width:560px) {
  .home-refined { --r-heading:clamp(1.3rem,5.65vw,1.7rem); }
  .home-refined .v3-quick-facts article { align-items:flex-start; gap:8px; }
  .home-refined .v3-quick-facts img { width:32px; height:32px; }
  .home-refined .v3-quick-facts b { font-size:.875rem; letter-spacing:0; }
  .home-refined .v3-quick-facts p { font-size:.8125rem!important; }
  .home-refined .v3-intro-summary { padding-inline:14px; }
  .home-refined .v3-intro h1 { font-size:clamp(1.2rem,5.5vw,1.7rem); }
  .home-refined .v3-intro-summary > p:not(.v3-hero-reading) br { display:none; }
  .home-refined .v3-what-we-make { padding:32px 0 36px; }
  .home-refined .v3-what-grid { width:calc(100% - 40px); }
  .home-refined .v3-what-copy h2 { font-size:clamp(1.3rem,5.8vw,1.65rem); }
  .r-tool-diagram small { font-size:.75rem; }
  .r-tool-symbols { height:104px; }
  .r-browser-diagram { height:104px; }
  .r-browser-functions { height:77px; gap:12px; }
  .home-refined .v3-product-card { padding:24px 22px 18px; }
  .home-refined .v3-product-visual { margin-bottom:18px; }
  .home-refined .v3-products-index { font-size:.8125rem; }
  .home-refined .v3-extension-guide-grid { width:calc(100% - 40px); }
  .home-refined .v3-extension-guide h2 { font-size:clamp(1.25rem,5.25vw,1.65rem); }
  .r-chrome-sign { margin-top:20px; }
  .r-guide-examples br { display:none; }
  .r-guide-examples strong { display:block; }
  .r-origin { grid-template-columns:minmax(0,1fr) 76px; gap:18px; padding-bottom:28px; margin-bottom:32px; align-items:start; }
  .home-refined .r-origin h2 { font-size:1.3rem; }
  .home-refined .r-origin .v3-philosophy-dog { width:76px; height:76px; border-width:4px; }
  .home-refined .r-origin > div { display:contents; }
  .r-origin-kicker { grid-column:1; grid-row:1; margin-bottom:0; }
  .home-refined .r-origin h2 { grid-column:1; grid-row:2; margin:0; }
  .home-refined .r-origin p:not(.r-origin-kicker) { grid-column:1/-1; }
  .home-refined .r-origin .v3-philosophy-dog { grid-column:2; grid-row:1/3; align-self:center; }
  .home-refined .v3-philosophy-title h2 { font-size:clamp(1.4rem,6vw,1.8rem); }
  .home-refined .v3-principles article { display:block; padding:24px 22px; }
  .home-refined .v3-principle-icon { margin:0 0 16px; }
  .home-refined .v3-principles h3 { text-wrap:balance; }
  .home-refined .v3-free { padding:40px 24px; text-align:left; }
  .home-refined .v3-free p br { display:none; }
  .home-refined .v3-free h2 .r-phrase { display:block; }
}
@media (max-width:380px) {
  .home-refined .v3-quick-facts article { display:block; }
  .home-refined .v3-quick-facts img { margin-bottom:8px; }
  .r-origin { grid-template-columns:minmax(0,1fr) 52px; }
  .home-refined .r-origin h2 { grid-column:1/-1; }
  .home-refined .r-origin .v3-philosophy-dog { width:52px; height:52px; grid-row:1; }
}