/* Products proposal: shared HoboHost colors and typography, explicit annual billing. */
.hh-products-page { --hp-green:#315a37; --hp-orange:#d07033; --hp-ink:#37443a; --hp-muted:#626b62; --hp-line:#dce2dc; color:var(--hp-ink); }
.hh-products-page main { background:#fff; }
.hh-products-page main h1,.hh-products-page main h2 { font-family:'AvenirNextLTPro-Regular',Arial,sans-serif; font-weight:normal; line-height:1.2; color:var(--hp-green); }
.hh-products-page main h2 { font-size:30px; margin:0 0 12px; }
.hh-products-page main h3 { font:23px/1.3 'AvenirNextLTPro-Medium',Arial,sans-serif; color:var(--hp-green); margin:0 0 10px; }
.hh-products-page main p { line-height:1.65; }
.hh-products-page main a:focus-visible,.hh-products-page main summary:focus-visible { outline:3px solid var(--hp-green); outline-offset:5px; }
.hp-eyebrow { color:#ad5726; margin:0 0 10px; font:11px/1.4 'AvenirNextLTPro-Medium',Arial,sans-serif; letter-spacing:.07em; text-transform:uppercase; }
.hp-hero { padding:28px 0; background:linear-gradient(110deg,#eaf0f4,#f5f7f7); border-bottom:1px solid var(--hp-line); }
.hp-hero-grid { display:grid; grid-template-columns:1.25fr 1fr; gap:48px; align-items:center; }
.hp-hero-grid::before,.hp-hero-grid::after,.hp-help-grid::before,.hp-help-grid::after { display:none; }
.hp-hero .hh-certified-banner { top:-28px; }
.hh-products-page main .hh-certified-banner { line-height:1.4; }
.hh-products-page main h1 { max-width:600px; font:42px/1.15 'AvenirNextLTPro-Medium',Arial,sans-serif; letter-spacing:-.015em; color:var(--hp-orange); margin:0 0 13px; }
.hp-tagline { font:29px/1.25 'AvenirNextLTPro-Regular',Arial,sans-serif; color:var(--hp-green); margin:0 0 17px; }
.hp-intro { max-width:550px; margin:0; font-size:16px; }
.hp-art { position:relative; text-align:center; }
.hp-art::before { content:''; position:absolute; top:13px; left:50%; transform:translateX(-50%); width:240px; height:240px; border-radius:50%; background:#e0e8de; }
.hp-art img { position:relative; display:block; width:100%; max-width:270px; height:auto; margin:auto; }
.hp-plans { padding:34px 0 38px; }
.hp-section-head { display:flex; justify-content:space-between; align-items:baseline; gap:25px; margin-bottom:23px; }
.hp-section-head p { color:var(--hp-muted); font-size:15px; margin:0; }
.hp-section-head h2 { margin:0!important; }
.hp-text-link { color:var(--hp-green); font-family:'AvenirNextLTPro-Medium',Arial,sans-serif; text-decoration:underline; text-underline-offset:4px; }
.hp-plan-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; }
.hp-included { padding:34px 0 37px; border-top:1px solid var(--hp-line); border-bottom:1px solid var(--hp-line); background:#fafbf8; }
.hp-included-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:22px; margin-top:25px; }
.hp-include-logo { display:flex; align-items:center; height:42px; margin-bottom:15px; }
.hp-include-logo img { display:block; max-width:100%; max-height:42px; width:auto; height:auto; }
.hp-wp-brand { display:flex; align-items:center; gap:10px; color:var(--hp-green); font:18px/1.2 'AvenirNextLTPro-Medium',Arial,sans-serif; }
.hp-wp-brand img { background:var(--hp-green); padding:5px; border-radius:50%; width:38px; height:38px; }
.hp-wp-brand small { display:block; font-size:11px; color:#ad5726; margin-top:3px; letter-spacing:.05em; text-transform:uppercase; }
.hh-products-page .hp-included h3 { font-size:20px; }
.hp-included article p { font-size:14px; color:var(--hp-muted); margin:0; }
.hp-included-note { margin:24px 0 0; padding-top:18px; border-top:1px solid var(--hp-line); font-size:14px; color:var(--hp-muted); }
.hp-help { padding:34px 0 38px; }
.hp-help-grid { display:grid; grid-template-columns:1fr 1fr; gap:60px; align-items:start; }
.hp-help p { color:var(--hp-muted); font-size:15px; margin:0 0 17px; }
.hp-help h2 { font-size:27px!important; }
.hp-help-links { display:flex; gap:20px; flex-wrap:wrap; font-size:15px; }
.hp-license { border-left:1px solid var(--hp-line); padding-left:30px; }
@media(max-width:1199px) {
 .hp-hero-grid { gap:30px; }
 .hp-plan-grid { grid-template-columns:repeat(2,minmax(0,1fr)); gap:22px; }
}
@media(min-width:768px) and (max-width:991px) {
 .hp-hero-grid { grid-template-columns:1.2fr 1fr; gap:22px; }
 .hh-products-page main h1 { font-size:36px; }
 .hp-tagline { font-size:26px; }
 .hp-art { padding-top:86px; }
 .hp-art::before { top:98px; width:215px; height:215px; }
 .hp-art img { max-width:245px; }
 .hp-included-grid { grid-template-columns:1fr 1fr; gap:27px; }
}
@media(max-width:767px) {
 .hp-hero { padding:26px 0; }
 .hp-hero .hh-certified-banner { top:-26px; }
 .hp-hero-grid { grid-template-columns:1fr; gap:20px; }
 .hh-products-page main .hp-hero h1 { font-size:32px; max-width:calc(100% - 110px); }
 .hp-tagline { font-size:26px; }
 .hp-art { display:none; }
 .hp-intro { font-size:16px; }
 .hp-section-head { display:block; }
 .hp-section-head p { margin-top:9px; }
 .hp-plans,.hp-included,.hp-help { padding:28px 0; }
 .hp-plan-grid { grid-template-columns:1fr; gap:20px; }
 .hp-included-grid { grid-template-columns:1fr 1fr; gap:25px 20px; }
 .hp-help-grid { grid-template-columns:1fr; gap:25px; }
 .hp-license { border-left:0; border-top:1px solid var(--hp-line); padding:25px 0 0; }
}
@media(max-width:420px) {
 .hp-included-grid { grid-template-columns:1fr; }
 .hp-included article { padding-bottom:21px; border-bottom:1px solid var(--hp-line); }
 .hp-included article:last-child { padding-bottom:0; border-bottom:0; }
}

/* Reuse the site's existing package design; only adapt its layout to the grid. */
.hp-plan-grid .hp-existing-plan { min-width:0; margin-bottom:0; display:flex; flex-direction:column; }
.hh-products-page .hp-plan-grid .package1 h3 { margin:0 0 1px; min-height:69px; padding:0 8px; }
.hp-plan-grid .package1 .inner.bg1 { min-height:110px; display:flex; align-items:center; justify-content:center; }
.hp-plan-grid .package1 .inner.bg1 .list1 { width:100%; }
.hp-plan-grid .package1 .bonus1 { margin-bottom:0; }
.hp-plan-grid .package1 .hp-plan-features { flex:1; display:flex; flex-direction:column; }
.hp-plan-grid .package1 .hp-plan-features .list2 { margin-bottom:20px; }
.hp-plan-grid .package1 .price { margin-top:auto; }
.hp-plan-grid .package1 .inner.bg2 { margin-top:auto; }
@media(max-width:767px) {
 .hh-products-page .hp-plan-grid .package1 h3 { padding:0 8px 3px; }
 .hp-plan-grid .package1 .inner.bg1 { min-height:0; }
}


@media(min-width:992px) {
 .hp-intro { max-width:none; }
 .hp-intro-fit { display:block; white-space:nowrap; }
}

@media(min-width:992px) {
 .hp-art img { transform:translateX(48px); }
 .hp-art::before { margin-left:48px; }
}