.tfw-subscription, .tfw-subscription *{ box-sizing:border-box; }
.tfw-subscription{ font-family:'Bricolage Grotesque','Inter',sans-serif; }
.tfw-subscription a{ color:inherit; text-decoration:none; }
.tfw-subscription .container{ max-width:1440px; margin:0 auto; padding:0 40px; }
.tfw-subscription .section{ padding:78px 0; }
.tfw-subscription .subscription-grid{ display:grid; grid-template-columns:minmax(0,656fr) minmax(0,640fr); gap:64px; align-items:center; }
.tfw-subscription .subscription-media{ position:relative; border-radius:20px; overflow:hidden; aspect-ratio:656/500; }
.tfw-subscription .subscription-media img{ width:100%; height:100%; object-fit:cover; }
.tfw-subscription .subscription-media::after{ content:''; position:absolute; inset:0; background: linear-gradient(37deg, rgba(0,0,0,.4) 0%, rgba(0,0,0,0) 100%); }
.tfw-subscription .review-card{
  position:absolute; left:30px; bottom:30px; width:287px; max-width:calc(100% - 60px);
  background: rgba(255,254,251,.9); border-radius:10px; padding:16px; display:flex; align-items:center; gap:16px; z-index:2;
}
.tfw-subscription .review-avatar{
  width:48px; height:48px; border-radius:50%; background:#C99E43; color:#FFFEFB;
  display:flex; align-items:center; justify-content:center; font-family:'Playfair Display',Georgia,serif; font-weight:400; font-size:18px; flex-shrink:0;
}
.tfw-subscription .review-card h6{ font-size:13px; margin:0 0 2px; font-weight:500; }
.tfw-subscription .review-card p{ font-size:11px; color:rgba(15,15,15,.6); margin:0; }

.tfw-subscription .eyebrow{ display:flex; align-items:center; gap:10px; color:#C99E43; font-size:11px; letter-spacing:.18em; font-weight:300; margin-bottom:14px; text-transform:uppercase; }
.tfw-subscription .eyebrow-line{ width:32px; height:1px; background:#C99E43; display:inline-block; }
.tfw-subscription .subscription-copy h2{ font-family:'Playfair Display',Georgia,serif; font-size:clamp(26px,3.2vw,40px); line-height:1.2; margin:0 0 18px; font-weight:600; }
.tfw-subscription .subscription-copy h2 em{ color:#C99E43; font-style:italic; font-weight:600; }
.tfw-subscription .lead{ color: rgba(15,15,15,.8); font-size:16px; line-height:1.6; max-width:460px; margin:0 0 24px; font-weight:300; }
.tfw-subscription .checklist{ margin:0 0 30px; padding:0; list-style:none; }
.tfw-subscription .checklist li{ position:relative; padding-left:20px; font-size:14px; color: rgba(15,15,15,.8); margin-bottom:15px; font-weight:300; }
.tfw-subscription .checklist li::before{ content:''; position:absolute; left:0; top:8px; width:6px; height:6px; border-radius:50%; background:#C99E43; }
.tfw-subscription .subscription-actions{ display:flex; align-items:center; flex-wrap:wrap; column-gap:32px; row-gap:16px; }

/* Primary button — Figma gold button (all values overridable in Style → Button) */
.tfw-subscription a.btn-sub{
  display:inline-flex; align-items:center; justify-content:center; gap:10px; white-space:nowrap; cursor:pointer;
  padding:15px 32px; font-size:16px; line-height:24px; font-weight:500; letter-spacing:1px; text-transform:none;
  border:0; border-radius:0; background:#C99E43; color:#FFFEFB;
  transition: background-color .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease, transform .25s ease;
}
.tfw-subscription a.btn-sub:hover{ background:#B08A38; color:#FFFEFB; }
.tfw-subscription .arrow{ display:block; flex-shrink:0; width:14px; height:14px; transition: transform .25s ease; }
.tfw-subscription a.btn-sub:hover .arrow{ transform:translateX(3px); }

/* Secondary text link — "Individual Plans →" (Figma 3227:3985) */
.tfw-subscription a.link-secondary{
  display:inline-flex; align-items:center; gap:8px; white-space:nowrap; cursor:pointer;
  font-size:16px; line-height:24px; font-weight:500; letter-spacing:1px; color:#0F0F0F;
  transition: color .25s ease;
}
.tfw-subscription a.link-secondary .link-text{ text-decoration-line:underline; text-decoration-thickness:1px; text-underline-offset:3px; }
.tfw-subscription a.link-secondary:hover{ color:#C99E43; }
.tfw-subscription a.link-secondary:hover .arrow{ transform:translateX(3px); }

@media (min-width:981px){
  .tf-sub-image-right .tfw-subscription .subscription-media{ order:2; }
}

@media (max-width:980px){
  .tfw-subscription .container{ padding:0 24px; }
  .tfw-subscription .subscription-grid{ grid-template-columns:1fr; gap:34px; }
}
@media (max-width:720px){
  .tfw-subscription .section{ padding:32px 0; } /* was 52px — matched to the tighter mobile section rhythm from Figma */
  .tfw-subscription .subscription-media{ aspect-ratio:350/234; }
  .tfw-subscription .review-card{ max-width:calc(100% - 32px); }
}
