/* The browsing surfaces use the same quiet controls as checkout and account. */
.browse-view { --browse-accent:#007a80; color:#192e30; background:#fff; }
.browse-view button { transition:background-color .15s, border-color .15s, color .15s; }
.browse-view button:focus-visible, .browse-view input:focus-visible, .browse-view select:focus-visible { outline:2px solid #007a80; outline-offset:3px; }
.browse-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:2px 0 30px; }
.brand-eyebrow { display:block; margin-bottom:10px; color:#00777d; font-size:12px; line-height:1.5; font-weight:800; }
.browse-heading h1 { margin:0; font-size:32px; line-height:1.25; font-weight:800; }
.browse-heading p { margin:10px 0 0; color:#637476; font-size:15px; line-height:1.6; }
.speak-action { display:inline-flex; align-items:center; justify-content:center; gap:9px; flex-shrink:0; min-height:44px; padding:10px 15px; border:1px solid #c7dcd9; border-radius:6px; background:#fff; color:#006d73; font-size:14px; font-weight:700; }
.speak-action svg { width:19px; height:19px; stroke-width:1.7; }
.speak-action:hover { background:#edf7f5; border-color:#70ada9; }
.service-destinations { display:flex; flex-wrap:wrap; gap:10px; padding-bottom:26px; border-bottom:1px solid #e4ebea; }
.service-destinations button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:48px; max-width:100%; padding:11px 12px; text-align:left; border:1px solid #b9d3d0; border-radius:6px; background:#fff; color:#214448; box-shadow:0 2px 0 #e6eeec; cursor:pointer; }
.service-destinations button:hover { border-color:#007a80; background:#e8f6f3; color:#00676d; }
.service-destinations button:active { background:#007a80; border-color:#007a80; color:#fff; box-shadow:none; transform:translateY(1px); }
.service-destinations button > svg:first-child { width:18px; height:18px; color:inherit; stroke-width:1.7; flex-shrink:0; }
.service-destinations button > span { font-size:14px; font-weight:700; line-height:1.5; min-width:0; overflow-wrap:anywhere; }
.service-destinations .category-arrow { width:14px; height:14px; flex-shrink:0; color:inherit; }
.browse-section-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin:27px 0 18px; }
.browse-section-heading h2 { margin:0; font-size:20px; line-height:1.4; font-weight:800; }
.browse-section-heading > .text-action { flex-shrink:0; min-height:36px; }
.offer-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.home-offer { display:flex; flex-direction:column; min-width:0; min-height:290px; padding:25px; border:1px solid #dbe5e2; border-radius:8px; background:#f3f8f5; color:#1d393a; }
.offer-top { display:flex; align-items:center; justify-content:space-between; gap:12px; }
.offer-label { font-size:12px; line-height:1.5; font-weight:800; color:#52706a; }
.offer-top > svg { width:27px; height:27px; stroke-width:1.5; }
.home-offer h3 { max-width:24ch; margin:19px 0 16px; font-size:24px; line-height:1.3; font-weight:800; }
.home-offer ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 15px; list-style:none; padding:0; margin:0 0 24px; }
.home-offer li { position:relative; padding-left:13px; font-size:13px; line-height:1.55; color:#55706b; }
.home-offer li::before { content:''; position:absolute; top:8px; left:0; width:5px; height:5px; background:#78a397; border-radius:50%; }
.offer-bottom { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-top:auto; padding-top:20px; border-top:1px solid #d6e4dd; }
.offer-price { display:flex; flex-direction:column; gap:5px; }
.offer-price > span { font-size:12px; color:#5b7470; line-height:1.4; }
.offer-price strong { font-size:30px; line-height:1.2; font-weight:800; white-space:nowrap; }
.offer-price del { font-size:13px; }
.offer-bottom button { display:flex; align-items:center; justify-content:center; gap:8px; min-height:44px; padding:10px 15px; border:1px solid #007a80; border-radius:6px; background:#007a80; color:#fff; font-size:14px; font-weight:700; white-space:nowrap; }
.offer-bottom button:hover { background:#005e65; border-color:#005e65; }
.offer-bottom button svg { width:17px; height:17px; }
.offer-digital { background:#193b3f; color:#fff; border-color:#193b3f; }
.offer-digital .offer-top { color:#96e2d8; }
.offer-digital .offer-label { color:#b9e7df; }
.offer-digital li { color:#d2e4e1; }
.offer-digital li::before { background:#8bc5b8; }
.offer-digital .offer-bottom { border-color:#426265; }
.offer-digital .offer-price > span { color:#c0d9d5; }
.offer-digital .offer-bottom button { background:#c9f5e5; border-color:#c9f5e5; color:#173b39; }
.offer-digital .offer-bottom button:hover { background:#a8e8d0; border-color:#a8e8d0; }
.home-utilities { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px; margin-top:30px; border-block:1px solid #e4ebea; }
.home-utilities button { display:flex; align-items:center; gap:12px; min-height:68px; border:0; padding:12px 2px; background:transparent; color:#315354; font-size:14px; font-weight:700; text-align:left; }
.home-utilities button:hover { color:#007a80; }
.home-utilities svg { width:20px; height:20px; stroke-width:1.7; flex-shrink:0; }
.home-utilities .utility-arrow { margin-left:auto; width:16px; color:#75928e; }
.institution-strip { display:flex; align-items:center; justify-content:space-between; gap:26px; padding:25px 0 0; }
.institution-strip > div:first-child { max-width:275px; }
.institution-strip h2 { margin:0; font-size:13px; line-height:1.5; font-weight:700; color:#45615d; }
.institution-strip p { margin:5px 0 0; color:#657773; font-size:12px; line-height:1.6; }
.institution-logos { flex:1; max-width:470px; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); align-items:center; gap:25px; }
.institution-logos img { width:100%; height:42px; object-fit:contain; }

.services-view .browse-heading { margin-bottom:26px; }
.catalog-categories { display:flex; flex-wrap:wrap; align-items:stretch; gap:0 18px; border-bottom:1px solid #dfe7e5; }
.catalog-categories button { display:flex; align-items:center; justify-content:center; gap:8px; padding:12px 3px 17px; min-height:55px; border:0; border-bottom:3px solid transparent; background:transparent; color:#617572; font-size:14px; line-height:1.45; font-weight:600; }
.catalog-categories button.active { color:#00777d; border-bottom-color:#007a80; font-weight:800; }
.catalog-categories button:hover { color:#00777d; }
.catalog-categories svg { width:18px; height:18px; flex-shrink:0; stroke-width:1.7; }
.mobile-category { display:none; }
.catalog-search { display:flex; align-items:center; gap:12px; min-height:52px; margin:22px 0 0; padding:0 16px; border:1px solid #dbe5e3; border-radius:6px; background:#f8faf9; }
.catalog-search:focus-within { background:#fff; border-color:#007a80; box-shadow:0 0 0 2px #dcefed; }
.catalog-search > svg { flex:0 0 20px; height:20px; color:#607c77; stroke-width:1.7; }
.catalog-search input { display:block; flex:1; width:100%; min-width:0; padding:14px 0; outline:none; border:0; background:transparent; font-size:16px; color:#253f3c; }
.catalog-search input::-webkit-search-cancel-button { appearance:none; }
.catalog-search input::placeholder { color:#718580; opacity:1; }
.browse-view .catalog-search input:focus-visible { outline:none; }
.catalog-search button { display:grid; place-items:center; width:32px; height:36px; padding:0; border:0; border-radius:4px; background:transparent; color:#55716b; }
.catalog-search button[hidden] { display:none; }
.catalog-search button:hover { background:#e8f0ed; }
.catalog-search button svg { width:17px; height:17px; }
.catalog-section-heading { margin:26px 0 10px; padding-bottom:13px; border-bottom:1px solid #dfe7e5; }
.catalog-section-heading h2 { font-size:18px; }
.catalog-section-heading > span { font-size:13px; color:#60746d; white-space:nowrap; }
.services-view .catalog-list { display:block; background:none; }
.services-view .catalog-list .service-row { display:grid; grid-template-columns:36px minmax(0,1fr) 115px 130px 44px; gap:12px; align-items:center; min-height:84px; padding:16px 0; border:0; border-bottom:1px solid #e7ecea; border-radius:0; background:transparent; box-shadow:none; }
.services-view .service-symbol { width:36px; height:36px; border:0; border-radius:5px; background:#edf6f3; color:#007a80; }
.services-view .service-symbol svg { width:20px; height:20px; stroke-width:1.6; }
.services-view .service-info { min-width:0; }
.services-view .service-info strong { display:block; font-size:16px; font-weight:650; line-height:1.5; overflow-wrap:anywhere; }
.services-view .service-row-action { display:contents; }
.services-view .service-price { display:flex; align-items:center; justify-content:center; min-width:0; min-height:42px; padding:9px 8px; border:1px solid #e1e8e4; border-radius:5px; color:#28463e; background:#f3f6f3; font-size:17px; line-height:1.35; font-weight:800; white-space:normal; text-align:center; }
.services-view .quote-price-label { font-size:13px; color:#62766d; font-weight:600; }
.services-view .service-price { flex-wrap:wrap; gap:2px 5px; }
.services-view .service-price small { font-size:12px; font-weight:600; }
.services-view .price-value { white-space:nowrap; }
.services-view .add-button { display:flex; align-items:center; justify-content:center; gap:7px; min-width:0; min-height:42px; padding:10px 12px; border:1px solid #007a80; border-radius:5px; background:#007a80; color:#fff; font-size:14px; line-height:1.4; font-weight:700; white-space:nowrap; }
.services-view .add-button svg { width:17px; height:17px; flex-shrink:0; }
.services-view .add-button:hover { border-color:#005e65; background:#005e65; }
.services-view .project-prompt { display:flex; align-items:center; justify-content:space-between; gap:20px; margin:28px 0 0; padding:21px 0; border:0; border-block:1px solid #dfe7e5; border-radius:0; background:transparent; }
.services-view .project-prompt[hidden] { display:none; }
.project-prompt h2 { margin:0; font-size:16px; line-height:1.5; }
.project-prompt p { margin:6px 0 0; font-size:14px; line-height:1.5; color:#617572; }
.project-prompt button { flex-shrink:0; }
.catalog-footer { display:flex; align-items:center; justify-content:center; gap:12px; margin-top:24px; font-size:13px; line-height:1.6; color:#6c807a; }
.catalog-footer .text-action { font-size:13px; min-height:36px; }
.catalog-empty { display:flex; flex-direction:column; align-items:center; justify-content:center; min-height:230px; padding:28px; text-align:center; }
.catalog-empty > svg { width:30px; height:30px; margin-bottom:16px; color:#739a8e; }
.catalog-empty h3 { margin:0; font-size:18px; }
.catalog-empty p { font-size:14px; color:#6c807a; line-height:1.6; }
.catalog-empty button { min-height:40px; }

@media (min-width:1024px) {
  .app-frame:has(.browse-view.active) .bottom-nav button { font-size:14px; }
}
@media (max-width:1100px) and (min-width:760px) {
  .service-destinations { gap:8px; }
  .service-destinations button { padding:11px 12px; }
  .catalog-categories { gap:10px; }
  .catalog-categories button { font-size:13px; }
  .catalog-categories svg { display:none; }
  .home-offer { padding:20px; }
}
@media (max-width:1023px) {
  .app-frame:has(.browse-view.active) .app-header { background:#fff; color:#192e30; border-bottom:1px solid #e1e8e6; box-shadow:none; }
  .app-frame:has(.browse-view.active) .header-logo img { filter:none; }
  .app-frame:has(.browse-view.active) .nav-main { padding-top:0 !important; }
  .app-frame:has(.browse-view.active) .nav-main-icon { position:static; width:21px; height:21px; border:0; border-radius:0; background:transparent; box-shadow:none; color:inherit; }
  .app-frame:has(.browse-view.active) .bottom-nav { box-shadow:none; }
  .app-frame:has(.browse-view.active) .bottom-nav button { font-size:12px; gap:5px; }
}
@media (max-width:759px) {
  .browse-view { padding:24px 20px 32px; }
  .browse-heading { align-items:flex-start; gap:14px; margin:0 0 24px; flex-wrap:wrap; }
  .browse-heading h1 { font-size:28px; }
  .browse-heading p { font-size:14px; max-width:33ch; margin-top:8px; }
  .brand-eyebrow { font-size:12px; margin-bottom:7px; }
  .home-heading .speak-action { min-height:40px; padding:8px 12px; }
  .service-destinations { gap:10px 8px; padding-bottom:24px; }
  .service-destinations button { min-height:46px; gap:7px; padding:10px 11px; }
  .service-destinations button > span { font-size:14px; }
  .service-destinations .category-arrow { width:12px; margin-left:0; }
  .browse-section-heading { gap:10px; margin-top:21px; margin-bottom:14px; }
  .browse-section-heading h2 { font-size:18px; }
  .browse-section-heading .text-action { font-size:13px; }
  .offer-grid { grid-template-columns:1fr; gap:16px; }
  .home-offer { min-height:280px; padding:23px; }
  .home-offer h3 { font-size:23px; }
  .home-offer ul { gap:8px 12px; }
  .offer-bottom button { padding:10px 13px; }
  .home-utilities { gap:24px; margin-top:24px; }
  .home-utilities button { min-height:64px; font-size:13px; gap:8px; }
  .home-utilities .utility-arrow { width:13px; }
  .institution-strip { display:block; padding-top:22px; }
  .institution-strip > div:first-child { max-width:none; }
  .institution-logos { gap:20px; margin:20px 0 0; max-width:440px; }
  .institution-logos img { height:38px; }
  .services-view .browse-heading { display:block; margin-bottom:22px; }
  .services-view .speak-action { margin-top:16px; }
  .catalog-categories { display:none; }
  .mobile-category { display:block; }
  .mobile-category > span { display:block; margin-bottom:8px; font-size:14px; font-weight:600; }
  .mobile-category select { width:100%; min-height:50px; padding:12px; border:1px solid #cbdad5; border-radius:6px; background:#fff; color:#21433c; font:inherit; font-size:16px; }
  .catalog-search { min-height:48px; margin-top:12px; padding:0 12px; }
  .catalog-search input { padding:12px 0; }
  .catalog-section-heading { margin-top:24px; margin-bottom:0; padding-bottom:15px; }
  .catalog-section-heading h2 { font-size:16px; }
  .catalog-section-heading > span { font-size:12px; }
  .services-view .catalog-list .service-row { grid-template-columns:minmax(0,1fr) 74px 98px 44px; min-height:83px; padding:17px 0; gap:8px; }
  .services-view .service-symbol { display:none; }
  .services-view .service-info strong { font-size:14px; line-height:1.5; }
  .services-view .service-price { font-size:16px; min-height:42px; padding:9px 5px; }
  .services-view .quote-price-label { font-size:12px; }
  .services-view .add-button { font-size:14px; padding:10px 7px; }
  .services-view .add-button svg { display:none; }
  .services-view .project-prompt { flex-direction:column; align-items:flex-start; gap:14px; }
}
@media (max-width:359px) {
  .browse-view { padding-inline:16px; }
  .browse-heading h1 { font-size:26px; }
  .service-destinations button { padding:10px; gap:7px; }
  .home-offer { padding:18px; }
  .home-offer h3 { font-size:21px; }
  .home-offer ul { grid-template-columns:1fr; gap:5px; }
  .offer-price strong { font-size:28px; }
  .offer-bottom button { padding:10px; }
  .offer-bottom button svg { display:none; }
  .services-view .catalog-list .service-row { grid-template-columns:minmax(0,1fr) 64px 91px 40px; gap:6px; }
  .services-view .add-button { font-size:13px; padding-inline:5px; }
  .services-view .service-price { font-size:15px; }
  .services-view .quote-price-label { font-size:12px; }
}
@media (prefers-reduced-motion:reduce) { .browse-view button { transition:none; } }
.service-whatsapp { display:inline-flex; align-items:center; justify-content:center; width:44px; height:44px; flex:0 0 44px; border:1px solid #bedbce; border-radius:6px; color:#167044; background:#f0f8f3; transition:background-color .15s,border-color .15s; }
.service-whatsapp svg { width:21px; height:21px; }
.service-whatsapp:hover { background:#dff3e8; border-color:#78b897; }
.service-whatsapp:focus-visible { outline:2px solid #007a80; outline-offset:3px; }
.offer-actions { display:flex; align-items:center; gap:8px; }
.offer-bottom { flex-wrap:wrap; }
.offer-digital .service-whatsapp { background:transparent; border-color:#709e92; color:#c9f5e5; }
.offer-digital .service-whatsapp:hover { background:#315954; }
@media (max-width:359px) { .services-view .service-whatsapp { width:40px; flex-basis:40px; } }
@media (max-width:479px) {
  .services-view .catalog-list .service-row { grid-template-columns:minmax(0,1fr) 68px 44px 44px; gap:8px; }
  .services-view .add-button { width:44px; min-height:44px; padding:10px; }
  .services-view .add-button span { display:none; }
  .services-view .add-button svg { display:block; width:20px; height:20px; }
  .services-view .service-whatsapp { width:44px; flex-basis:44px; }
}