/* Refined layout: open sections with typographic headings instead of solid colour bars.
   Colour stays as an accent: a short coloured rule under each heading, season names, buttons. */
.wrap{--c:var(--accent);max-width:900px;gap:44px;padding-block:40px 56px;font-size:14px;line-height:1.6}
.wrap .b-terra{--c:var(--accent)} .wrap .b-sage{--c:var(--sage)} .wrap .b-soil{--c:var(--soil)}
.wrap .b-slate{--c:var(--slate)} .wrap .b-green{--c:var(--leaf)}

/* masthead: no box, logo and title side by side */
.wrap .masthead{background:none;border:0;border-radius:0;grid-template-columns:auto 1fr;align-items:center;overflow:visible}
.wrap .brand{background:none;border-right:1px solid var(--line);padding:4px 26px 4px 0}
.wrap .title{padding:0 0 0 26px}
.wrap h1{font-size:46px;margin:6px 0 4px}
.wrap .sub{font-size:13px}

/* sections: no boxes */
.wrap .card{background:none;border:0;border-radius:0;overflow:visible}
.wrap .bar{background:linear-gradient(var(--c),var(--c)) left bottom/36px 2px no-repeat,linear-gradient(var(--line),var(--line)) left bottom/100% 1px no-repeat!important;
  color:var(--ink);font-family:var(--display);font-weight:500;font-size:27px;line-height:1.15;padding:0 0 12px;margin-bottom:14px}
.wrap .bar span{font-family:var(--body);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);opacity:1}

/* tables: hairlines only */
.wrap table{background:none}
.wrap th,.wrap .card th{background:none!important;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);font-weight:500;padding:6px 12px 8px 0}
.wrap td{padding:12px 12px 12px 0;font-size:13px}
.wrap td+td,.wrap th+th{border-left:0}

/* grids that were boxed */
.wrap .plan{gap:18px 28px;padding:4px 0}
.wrap .plan div{border:0;padding:0}
.wrap .perks div,.wrap .cover div{border:0;padding:0}
.wrap .perks{gap:20px 28px}
.wrap .covers,.wrap .tags{padding:10px 0}
.wrap .tag{border-width:1px}
.wrap .privacy{padding:0 0 0 18px;font-size:13px}
.wrap .privlink,.wrap .cta,.wrap .login,.wrap .collapsed,.wrap .pn,.wrap .intro{padding-left:0;padding-right:0}
.wrap .pn{border-bottom:0;padding-top:8px;padding-bottom:8px}

/* seasons */
.wrap .season{border-bottom:1px solid var(--line)}
.wrap .season h3{background:none!important;border-right:0;padding:12px 12px 12px 0;font-family:var(--display);font-size:20px;font-weight:500}
.wrap .season h3 small{font-family:var(--body)}

/* example pictures: soft frame instead of tinted panel */
.wrap .exshot,.wrap .shot{background:none;padding:0 28px 0 0;border:0}
.wrap .exText{padding:0}

/* notices and buttons */
.wrap button,.wrap a.btn{padding:8px 20px;font-size:13px}
.wrap .dp{border-top:1px solid var(--line);padding-top:16px}
@media (max-width:760px){.wrap .exshot,.wrap .shot{padding:0 0 18px}}
@media (max-width:560px){
  .wrap{gap:36px}
  .wrap .masthead{grid-template-columns:1fr}
  .wrap .brand{border-right:0;border-bottom:1px solid var(--line);padding:0 0 14px}
  .wrap .title{padding:14px 0 0}
  .wrap h1{font-size:36px}
  .wrap .bar{font-size:24px}
  .wrap .season h3{padding-bottom:0}
}
/* lighter notices and headings inside sections */
.wrap .demo{background:none;border:0;border-left:2px solid #d9b45a;border-radius:0;padding:4px 0 4px 16px}
.wrap .perks h3{font-family:var(--display);font-size:19px;font-weight:500;color:var(--leaf);margin-bottom:2px}
.wrap .login p,.wrap .exText p{font-size:13.5px}
.wrap .cta{padding-top:18px}
.wrap .cta p:empty{display:none}
.wrap .exshot img{box-shadow:0 10px 30px rgba(62,42,34,.12);border-radius:6px}

/* ---- Fuller: warm header band, soft rounded panels, stronger text ---- */
.wrap{--muted:#76625a;--panel-shadow:0 1px 2px rgba(62,42,34,.04),0 10px 30px rgba(62,42,34,.06);gap:28px;color:var(--ink)}
.wrap .masthead{background:linear-gradient(135deg,#fbe6dc 0%,#f8ece3 60%,#eef3ea 100%);border-radius:16px;padding:30px 34px}
.wrap .brand{border-right-color:rgba(176,100,75,.35)}
.wrap .card{background:var(--card);border-radius:16px;padding:28px 32px 30px;box-shadow:var(--panel-shadow)}
.wrap .card.open{background:none;box-shadow:none;padding:0;border-radius:0}
.wrap .bar{margin-bottom:18px}
.wrap .two{gap:28px}
.wrap .demo{background:#fcf3dc;border-left:3px solid #d9b45a;border-radius:0 10px 10px 0;padding:12px 18px}
.wrap .season:last-child{border-bottom:0}
.wrap .dp{border-top:0;padding-top:0}
.wrap footer{border-top:0}
.wrap .tag{background:rgba(255,255,255,.6)}
@media (max-width:560px){
  .wrap{gap:20px}
  .wrap .masthead{padding:22px 20px}
  .wrap .card{padding:22px 18px 24px;border-radius:14px}
}
.wrap .perks{grid-template-columns:repeat(4,1fr)}
@media (max-width:760px){.wrap .perks{grid-template-columns:1fr 1fr}}
a.brand{text-decoration:none;color:inherit}
a.brand:hover b{text-decoration:underline;text-underline-offset:3px;text-decoration-thickness:1px}

/* Larger, clearer logo */
.wrap .brand{gap:14px}
.wrap .brand img{width:62px!important;height:auto!important}
.wrap .brand b{font-size:25px;line-height:1.05;color:var(--accent-ink)}
.wrap .brand small{font-size:8.5px;letter-spacing:.2em;color:var(--accent-ink);font-weight:500;display:block;margin-top:4px}
@media (max-width:560px){.wrap .brand img{width:52px!important}.wrap .brand b{font-size:22px}}

/* let wide tables scroll inside their panel instead of widening the page */
.wrap>*{min-width:0}
/* phones: each table row becomes a small stacked card */
@media (max-width:560px){
  .wrap .scroll table{min-width:0}
  .wrap .scroll thead{display:none}
  .wrap .scroll tr{display:grid;grid-template-columns:1fr;gap:3px;padding:12px 0;border-bottom:1px solid var(--line)}
  .wrap .scroll tr:last-child{border-bottom:0}
  .wrap .scroll td{border:0!important;padding:0!important}
  .wrap .scroll td:has(>span.dim:only-child),.wrap .scroll td:has(>.blank:only-child){display:none}
  .wrap .scroll td:first-child{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
  .wrap .scroll td:first-child>div{margin:0!important}
}