/* Gyógytornász — gyogytorn-asz.hu
   One class per unique declaration set, so repeated components
   (topic cards, buttons, price cards) share a single rule. */

* { margin: 0; padding: 0; box-sizing: border-box; }
  html { scroll-behavior: smooth; scroll-padding-top: 84px; }
  body { font-family: 'Mulish', system-ui, sans-serif; color: #2c2d27; background: #f4efe4; -webkit-font-smoothing: antialiased; }
  a { color: #2b5233; text-decoration: none; }
  a:hover { color: #B06885; }
  ::selection { background: #7E405C; }

/* Grid and flex children default to min-width: auto, which is what pushes a
   centered layout past the screen edge. Element selectors, not [class], so
   unclassed wrapper divs are covered too. */
body div, body a, body p, body h1, body h2, body h3, body section, body header, body nav, body footer {
  min-width: 0;
}

/* ---------- element styles ---------- */
.u1 { background: #f4efe4; overflow-x: clip; }
.u2 { position: sticky; top: 0; z-index: 50; background: rgba(244,239,228,0.86); backdrop-filter: blur(10px); border-bottom: 1px solid #e0d7c4; }
.u3 { max-width: 1200px; margin: 0 auto; padding: 14px 32px; display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.u4 { display: flex; align-items: center; gap: 10px; }
.u5 { height: 52px; width: auto; display: block; }
.u6 { display: flex; align-items: center; flex-wrap: wrap; gap: 30px; font-size: 15px; font-weight: 600; letter-spacing: 0.01em; }
.u7 { color: #3a3b33; }
.u8 { display: inline-flex; align-items: center; gap: 8px; color: #6E3550; padding: 10px 20px; border-radius: 999px; font-weight: 700; background-color: #E6ABBC; }
.u9 { max-width: 1200px; margin: 0 auto; padding: 56px 32px 40px; display: grid; grid-template-columns: 1.05fr 0.95fr; gap: 56px; align-items: center; }
.u10 { display: flex; align-items: center; gap: 10px; margin-bottom: 22px; }
.u11 { width: 15px; height: auto; color: #B06885; }
.u12 { font-size: 13px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #7d7a6b; }
.u13 { font-family: 'Cormorant Garamond',serif; font-weight: 600; font-size: 55px; line-height: 1.04; color: #24482d; letter-spacing: -0.01em; }
.u14 { margin-top: 24px; font-size: 19px; line-height: 1.65; color: #54554c; max-width: 480px; }
.u15 { color: #2b5233; font-weight: 700; }
.u16 { margin-top: 34px; display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
.u17 { display: inline-flex; align-items: center; gap: 10px; color: #6E3550; padding: 15px 28px; border-radius: 999px; font-size: 16px; font-weight: 700; background-color: #E6ABBC; }
.u18 { display: inline-flex; align-items: center; gap: 8px; color: #2b5233; padding: 15px 22px; border-radius: 999px; font-size: 16px; font-weight: 700; border: 1.5px solid #c9bfa8; }
.u19 { position: relative; }
.u20 { position: relative; z-index: 1; display: block; width: 100%; height: auto; }
.u21 { position: absolute; left: -24px; bottom: 34px; z-index: 2; background: #fffdf7; border: 1px solid #e6ddca; border-radius: 18px; padding: 16px 20px; box-shadow: 0 18px 36px -22px rgba(43,82,51,0.5); display: flex; align-items: center; gap: 14px; }
.u22 { width: 26px; height: auto; color: #B06885; }
.u23 { font-family: 'Cormorant Garamond',serif; font-size: 30px; font-weight: 700; line-height: 1; color: #24482d; }
.u24 { font-size: 12px; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; color: #7d7a6b; }
.u25 { max-width: 1200px; margin: 8px auto 0; padding: 0 32px; }
.u26 { border-radius: 22px; padding: 26px 40px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 24px; color: #6E3550; background-color: #E6ABBC; }
.u27 { display: flex; align-items: center; gap: 16px; }
.u28 { font-family: 'Cormorant Garamond',serif; font-size: 23px; font-weight: 600; line-height: 1.1; color: #eef2e9; }
.u29 { font-size: 14.5px; color: #7E405C; }
.u30 { height: 38px; width: 1px; background: #3f6349; }
.u31 { max-width: 1200px; margin: 0 auto; padding: 90px 32px 70px; display: grid; grid-template-columns: 0.9fr 1.1fr; gap: 64px; align-items: start; }
.u32 { font-size: 13px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #B06885; margin-bottom: 14px; }
.u33 { font-family: 'Cormorant Garamond',serif; font-weight: 600; font-size: 46px; line-height: 1.08; color: #24482d; }
.u34 { font-family: 'Caveat',cursive; font-size: 27px; color: #2b5233; margin-top: 22px; line-height: 1.2; }
.u35 { font-size: 18px; line-height: 1.8; color: #4c4d44; }
.u36 { margin-bottom: 20px; }
.u37 { color: #2b5233; }
.u38 { margin-bottom: 0; }
.u39 { margin-top: 34px; display: flex; gap: 14px; flex-wrap: wrap; }
.u40 { flex: 1; min-width: 150px; background: #fffdf7; border: 1px solid #e6ddca; border-radius: 16px; padding: 20px 22px; }
.u41 { font-family: 'Cormorant Garamond',serif; font-size: 38px; font-weight: 700; color: #2b5233; line-height: 1; }
.u42 { font-size: 14px; color: #6b6c62; margin-top: 4px; }
.u43 { background: #eae3d2; border-top: 1px solid #e0d7c4; border-bottom: 1px solid #e0d7c4; }
.u44 { max-width: 1200px; margin: 0 auto; padding: 84px 32px; }
.u45 { text-align: center; max-width: 640px; margin: 0 auto 52px; }
.u46 { display: grid; grid-template-columns: repeat(4,1fr); gap: 20px; }
.u47 { background: #fffdf7; border: 1px solid #e6ddca; border-radius: 20px; padding: 30px 28px; }
.u48 { width: 52px; height: 52px; border-radius: 14px; background: #eaf0e6; display: flex; align-items: center; justify-content: center; margin-bottom: 18px; color: #2b5233; }
.u49 { width: 32px; height: 32px; object-fit: contain; display: block; }
.u50 { font-family: 'Cormorant Garamond',serif; font-size: 24px; font-weight: 600; color: #24482d; margin-bottom: 8px; }
.u51 { font-size: 15.5px; line-height: 1.6; color: #6b6c62; }
.u52 { margin-top: 34px; background: #fffdf7; border: 1px dashed #c8a988; border-radius: 18px; padding: 22px 28px; display: flex; align-items: center; gap: 16px; justify-content: center; text-align: center; }
.u53 { width: 18px; height: auto; color: #B06885; flex-shrink: 0; }
.u54 { font-size: 16px; color: #54554c; line-height: 1.5; }
.u55 { max-width: 1200px; margin: 0 auto; padding: 88px 32px; overflow-wrap: break-word; }
.u56 { display: grid; grid-template-columns: 0.85fr 1.15fr; gap: 56px; align-items: start; }
.u57 { margin-top: 18px; font-size: 17px; line-height: 1.7; color: #54554c; }
.u58 { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.u59 { background: #fffdf7; border: 1px solid #e6ddca; border-radius: 14px; padding: 20px 22px; display: flex; align-items: center; gap: 14px; }
.u60 { width: 14px; height: auto; color: #B06885; flex-shrink: 0; }
.u61 { font-size: 16.5px; font-weight: 600; color: #2c2d27; }
.u62 { grid-column: span 2; background: #fffdf7; border: 1px solid #e6ddca; border-radius: 14px; padding: 20px 22px; display: flex; align-items: center; gap: 14px; }
.u63 { color: #6E3550; background-color: #E6ABBC; }
.u64 { max-width: 1200px; margin: 0 auto; padding: 88px 32px; }
.u65 { font-size: 13px; font-weight: 700; letter-spacing: 0.18em; text-transform: uppercase; color: #7E405C; margin-bottom: 14px; }
.u66 { font-family: 'Cormorant Garamond',serif; font-weight: 600; font-size: 46px; line-height: 1.08; color: #6E3550; }
.u67 { display: grid; grid-template-columns: 1.25fr 1fr; gap: 20px; align-items: stretch; }
.u68 { height: 410px; border-radius: 22px; padding: 38px 36px; display: flex; flex-direction: column; justify-content: center; background-color: #F5E2E8; }
.u69 { display: inline-flex; align-self: flex-start; align-items: center; gap: 8px; background: #B06885; color: #FFFFFF; font-size: 12px; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; padding: 6px 14px; border-radius: 999px; margin-bottom: 20px; }
.u70 { font-family: 'Cormorant Garamond',serif; font-size: 26px; font-weight: 600; color: #6E3550; margin-bottom: 6px; }
.u71 { display: flex; align-items: baseline; gap: 8px; margin-bottom: 22px; }
.u72 { font-family: 'Cormorant Garamond',serif; font-size: 52px; font-weight: 700; color: #7E405C; line-height: 1; }
.u73 { font-size: 18px; color: #8A5474; }
.u74 { height: 1px; margin-bottom: 22px; background-color: #E6ABBC; }
.u75 { list-style: none; display: flex; flex-direction: column; gap: 12px; }
.u76 { display: flex; gap: 12px; align-items: flex-start; font-size: 16px; color: #775168; }
.u77 { color: #A05073; font-weight: 800; }
.u78 { display: flex; flex-direction: column; gap: 20px; }
.u79 { height: 195px; box-sizing: border-box; border-radius: 22px; padding: 28px 32px; display: flex; flex-direction: column; justify-content: center; background-color: #F5E2E8; }
.u80 { font-family: 'Cormorant Garamond',serif; font-size: 23px; font-weight: 600; color: #6E3550; }
.u81 { font-size: 14.5px; color: #8A5474; margin-bottom: 10px; }
.u82 { display: flex; align-items: baseline; gap: 8px; }
.u83 { font-family: 'Cormorant Garamond',serif; font-size: 38px; font-weight: 700; color: #7E405C; line-height: 1; }
.u84 { font-size: 16px; color: #8A5474; }
.u85 { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.u86 { height: 195px; box-sizing: border-box; border-radius: 22px; padding: 26px 26px; display: flex; flex-direction: column; justify-content: center; background-color: #F5E2E8; }
.u87 { font-family: 'Cormorant Garamond',serif; font-size: 20px; font-weight: 600; color: #6E3550; }
.u88 { display: flex; align-items: baseline; gap: 6px; margin-top: 10px; }
.u89 { font-family: 'Cormorant Garamond',serif; font-size: 32px; font-weight: 700; color: #7E405C; line-height: 1; }
.u90 { font-size: 14px; color: #8A5474; }
.u91 { font-size: 13.5px; color: #7E405C; margin-top: 6px; font-weight: 600; }
.u92 { text-align: center; font-size: 14.5px; color: #7E405C; margin-top: 28px; }
.u93 { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: center; }
.u94 { margin-top: 20px; font-size: 18px; line-height: 1.7; color: #54554c; max-width: 440px; }
.u95 { font-family: 'Caveat',cursive; font-size: 26px; color: #2b5233; margin-top: 20px; }
.u96 { display: flex; flex-direction: column; gap: 14px; }
.u97 { background: #fffdf7; border: 1px solid #e6ddca; border-radius: 18px; padding: 22px 26px; display: flex; align-items: center; gap: 18px; }
.u98 { width: 48px; height: 48px; border-radius: 12px; background: #eaf0e6; display: flex; align-items: center; justify-content: center; color: #2b5233; flex-shrink: 0; }
.u99 { min-width: 0; }
.u100 { font-size: 13px; font-weight: 600; letter-spacing: 0.06em; text-transform: uppercase; color: #8a8b7f; }
.u101 { font-family: 'Cormorant Garamond',serif; font-size: 26px; font-weight: 600; color: #24482d; }
.u102 { font-family: 'Cormorant Garamond',serif; font-size: clamp(16px, 4.4vw, 24px); font-weight: 600; color: #24482d; word-break: break-word; }
.u103 { font-family: 'Cormorant Garamond',serif; font-size: clamp(16px, 4.4vw, 24px); font-weight: 600; color: #24482d; }
.u104 { background: #eae3d2; border-radius: 18px; padding: 18px 26px; display: flex; align-items: center; gap: 14px; }
.u105 { font-size: 15.5px; color: #54554c; }
.u106 { color: #F3E3EA; background-color: #B06885; }
.u107 { max-width: 1200px; margin: 0 auto; padding: 48px 32px; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 28px; }
.u108 { height: 48px; width: auto; }
.u109 { display: flex; gap: 26px; font-size: 15px; font-weight: 600; }
.u110 { color: #F3E3EA; }
.u111 { border-top: 1px solid #2a4a30; }
.u112 { max-width: 1200px; margin: 0 auto; padding: 18px 32px; font-size: 13px; color: #F3E3EA; }

/* ---------- hover states ---------- */
.h1:hover { background: #8E2F5C; color: #FFFFFF; }
.h2:hover { border-color: #B06885; color: #B06885; }
.h3:hover { border-color: #B06885; }
.h4:hover { color: #fff; }

/* ---------- responsive ---------- */
@media (max-width: 1000px) {
  .u46 { grid-template-columns: repeat(2, 1fr); }
  .u9, .u31, .u56, .u58, .u93 { grid-template-columns: 1fr; }

  /* a card spanning two tracks would keep the collapsed grid two tracks wide */
  .u62 { grid-column: auto; }

  /* pricing: single column, and release the desktop pixel heights */
  .u67 { grid-template-columns: 1fr; }
  .u68, .u79, .u86 { height: auto; min-height: 0; }
}

/* header: the link row is the first thing to run out of room */
@media (max-width: 900px) {
  .u3 { padding: 12px 20px; }
  .u6 { gap: 18px; font-size: 14px; }
  .u5 { height: 44px; }
}

@media (max-width: 760px) {
  .u3 { flex-direction: column; align-items: center; gap: 10px; padding: 12px 18px; }
  .u6 { justify-content: center; gap: 14px 16px; font-size: 13.5px; }
  .u8 { padding: 8px 16px; }
}

@media (max-width: 700px) {
  .u85 { grid-template-columns: 1fr; }

  /* the badge hangs into the desktop gutter, which phones do not have */
  .u21 { left: 8px; }
}

@media (max-width: 620px) {
  .u46 { grid-template-columns: 1fr; }
  .u13 { font-size: 38px; }
  .u33, .u66 { font-size: 32px; }
  .u5 { height: 40px; }

  /* tighter gutters so cards keep their inner padding */
  .u55, .u64, .u44, .u31, .u9 { padding-left: 18px; padding-right: 18px; }
}