/*
Theme Name:   GeneratePress Child - BookTeeOff
Theme URI:    https://bookteeoff.com
Description:  BookTeeOff 전용 커스터마이징을 위한 GeneratePress 자식 테마. 부모 테마(GeneratePress) 업데이트 시에도 이 파일들은 영향받지 않습니다.
Author:       BookTeeOff
Template:     generatepress
Version:      1.0.0
Text Domain:  generatepress-child
*/

/*
---------------------------------------------------------
이 파일은 커스텀 CSS가 필요할 때만 사용합니다.
가능하면 CSS는 bookteeoff-core 플러그인의
assets/css/ 안에서 관리하는 것을 우선합니다.
(플러그인은 테마와 독립적으로 동작하기 때문에 더 안전합니다.)

이 파일은 "테마 레벨"에서만 필요한 스타일
(예: GeneratePress 특정 셀렉터 오버라이드)이 있을 때만 사용하세요.
---------------------------------------------------------
*/

/* =========================================================
   BookTeeOff design tokens — single source of truth (confirmed 2026-07-17).
   Two layers: primitives (raw scales; hex is born here and nowhere else)
   → semantics (what components actually reference). Components never use
   primitives or hardcode hex. Canonical doc incl. WCAG measurements:
   bookteeoff-docs/docs/design-tokens.md
   ========================================================= */
:root {
	/* ---- layer 1: primitives ----
	   Emerald scale rebased around the confirmed brand green #01ab6d
	   (대표 확정 2026-07-20). 500 is the anchor; 700 is the darkest step
	   that still reads as the brand while passing AA for text/buttons. */
	--bto-green-950: #013322;
	--bto-green-900: #024e33;
	--bto-green-800: #026845;
	--bto-green-700: #027a4e;
	--bto-green-600: #029158;
	--bto-green-500: #01ab6d;
	--bto-green-400: #33bb85;
	--bto-green-300: #66cc9f;
	--bto-green-200: #9fe0c2;
	--bto-green-100: #d4f3e5;
	--bto-green-50:  #e8f9f0;

	--bto-ink-900: #000000;
	--bto-ink-600: #4c5254;
	--bto-ink-400: #656c70;

	/* neutral borders/surfaces, retinted from olive-sage to emerald-gray */
	--bto-sage-300: #929f98;
	--bto-sage-200: #b9c6bf;
	--bto-sage-100: #d1dcd7;
	--bto-sage-50:  #f2f6f4;

	--bto-gray-50: #f6f6f6;    /* neutral gray — no green tint (대표 2026-07-29) */

	--bto-ivory-100: #eef4ea;

	--bto-amber-900: #633806;
	--bto-amber-500: #e8a400;  /* rating stars — graphics only, never text */
	--bto-amber-50:  #faeeda;

	/* violet — 프로모션 배지 + 선택 상태(booking widget). 기존 select-* 리터럴을
	   원색으로 승격한 것이라 값은 그대로다. */
	--bto-violet-700: #3c3489;
	--bto-violet-300: #7f77dd;
	--bto-violet-50:  #eeedfe;

	--bto-plum-700: #8f2c63;
	--bto-plum-50:  #f7ebf2;   /* refunded chip bg (2026-07-29 lifecycle extension) */

	--bto-red-500: #f12243;    /* the one site red — error/danger/ribbon unified (대표 2026-07-29); 3.9:1 on white → graphics, buttons, large/bold text */

	--bto-blue-700:  #1f5fa8;  /* status: checking */
	--bto-blue-50:   #e7f0fb;
	--bto-slate-700: #55606b;  /* status: expired */
	--bto-slate-50:  #ebeef1;

	/* ---- layer 2: semantics (legacy --bto-* names kept for compat) ---- */
	--bto-canvas: #ffffff;                     /* page background; home overrides to ivory */
	--bto-surface: #ffffff;                    /* card background */
	--bto-surface-2: var(--bto-sage-50);       /* hover / thumbnail background */
	--bto-surface-3: var(--bto-gray-50);       /* neutral soft field (cart optional-extras section) */
	--bto-ink: var(--bto-ink-900);             /* headings + body text */
	--bto-ink-2: var(--bto-ink-600);           /* secondary text */
	--bto-muted: var(--bto-ink-400);           /* faint labels (AA-corrected, 4.5:1+) */
	--bto-border: var(--bto-sage-100);
	--bto-border-strong: var(--bto-sage-200);
	--bto-border-stronger: var(--bto-sage-300); /* darkest input border (booking widget) */
	--bto-green: var(--bto-green-700);         /* brand — buttons, prices, links (AA 5.4:1) */
	--bto-green-hover: var(--bto-green-800);   /* hover darkens (lighter steps fail AA) */
	--bto-green-mid: var(--bto-green-500);     /* the #01ab6d anchor — accents/graphics only, never text */
	--bto-green-fg: #ffffff;                   /* text/icons on brand green — pure white (green-50 tint dropped, 대표 2026-07-29) */
	--bto-green-soft: var(--bto-green-50);     /* soft brand fill — selected band, light hovers, number discs */
	--bto-green-fg-muted: var(--bto-green-100); /* subdued text on brand green */
	--bto-chip-bg: var(--bto-green-100);       /* light-green chips */
	--bto-chip-fg: var(--bto-green-700);
	--bto-badge-promo-bg: var(--bto-violet-50); /* 프로모션 배지 — 보라 계열 (대표 2026-08-06) */
	--bto-badge-promo-fg: var(--bto-violet-700);
	--bto-badge-verify-bg: var(--bto-amber-50); /* 골프 프로모션 카드의 검증 방식 칩 — 앰버 유지 */
	--bto-badge-verify-fg: var(--bto-amber-900);
	--bto-ivory: var(--bto-ivory-100);         /* home canvas + header base */
	--bto-footer-green: var(--bto-green-900);

	/* weather section — green family (blue tried 2026-07-20, felt off) */
	--bto-weather-accent: var(--bto-green-300); /* icons, selected-day border */
	--bto-weather-bg: var(--bto-green-50);      /* selected-day + active toggle background */

	/* rating stars — course reviews (review.css) and hotel star ratings */
	--bto-star: var(--bto-amber-500);
	--bto-star-empty: var(--bto-border-strong);

	/* status */
	--bto-excl-fg: var(--bto-plum-700); /* "excludes" marker (booking widget) */
	--bto-success: var(--bto-green-700); /* 600 in the emerald scale fails AA as text */
	--bto-warn-fg: #8a6116;
	--bto-warn-bg: #fbf4e4;
	--bto-error-fg: var(--bto-red-500); /* error text — 대표 accepts the sub-AA contrast for the unified red */
	--bto-error-bg: #fbebe8;
	--bto-error-border: #edc3bb; /* subtle red border (error-tone notices) */
	--bto-danger: var(--bto-red-500);   /* destructive actions (cancel, remove-hover) + wishlist heart */
	--bto-ribbon: #000000;   /* promo corner ribbon — black (대표 direct edit 2026-08-05; supersedes the unified-red era) */
	/* booking-widget "selected" state (confirmed prototype look; the one non-brand hue) */
	--bto-select-bg: var(--bto-violet-50);
	--bto-select-fg: var(--bto-violet-700);
	--bto-select-border: var(--bto-violet-300);

	/* booking status chips — one distinct hue each, so the flow is scannable
	   at a glance (요청 gray · 확인 blue · 결제대기 amber · 결제완료 violet ·
	   예약확정 green · 취소 red · 만료 slate). */
	--bto-chip-requested-bg: var(--bto-sage-50);   --bto-chip-requested-fg: var(--bto-ink-600);
	--bto-chip-checking-bg:  var(--bto-blue-50);   --bto-chip-checking-fg:  var(--bto-blue-700);
	--bto-chip-offered-bg:   var(--bto-amber-50);  --bto-chip-offered-fg:   var(--bto-amber-900);
	--bto-chip-paid-bg:      var(--bto-select-bg); --bto-chip-paid-fg:      var(--bto-select-fg);
	--bto-chip-booked-bg:    var(--bto-green-100); --bto-chip-booked-fg:    var(--bto-green-700);
	--bto-chip-completed-bg: var(--bto-green-50);  --bto-chip-completed-fg: var(--bto-green-900); /* played — archival success */
	--bto-chip-cancelled-bg: var(--bto-error-bg);  --bto-chip-cancelled-fg: var(--bto-error-fg);  /* cancelled BEFORE payment */
	--bto-chip-refunded-bg:  var(--bto-plum-50);   --bto-chip-refunded-fg:  var(--bto-plum-700);  /* cancelled AFTER payment (refunded) */
	--bto-chip-expired-bg:   var(--bto-slate-50);  --bto-chip-expired-fg:   var(--bto-slate-700);

	/* typography — the site font lives here, not in GP customizer.
	   Pretendard Variable is enqueued in functions.php (dynamic subset). */
	--bto-font-sans: "Pretendard Variable", Pretendard, -apple-system, system-ui, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";

	/* type scale — size + weight per heading level */
	--bto-fs-h1: 32px;  --bto-fw-h1: 600;
	--bto-fs-h2: 24px;  --bto-fw-h2: 600;
	--bto-fs-h3: 18px;  --bto-fw-h3: 600;
	--bto-fs-h4: 16px;  --bto-fw-h4: 600;

	/* shape */
	--bto-radius-sm: 8px;
	--bto-radius: 12px;
	--bto-radius-lg: 20px;
	--bto-shadow-1: 0 1px 3px rgba(0, 0, 0, .04);
	--bto-shadow-2: 0 10px 26px rgba(2, 74, 48, .14);
	--bto-shadow-3: 0 16px 44px rgba(28, 29, 31, .18);
	--bto-focus-ring: 0 0 0 3px rgba(1, 171, 109, .25);

	--bto-header-h: 64px;
}

/* ---------------------------------------------------------
   Sticky footer — on short pages (post-submit notice, empty cart) the
   footer floated mid-viewport with a white void below it (대표 2026-07-31).
   The body becomes a column: .site grows, the footer lands on the bottom.
   --------------------------------------------------------- */
body {
	min-height: 100vh;
	min-height: 100svh;
	display: flex;
	flex-direction: column;
}
body.admin-bar { min-height: calc(100vh - 32px); }
/* width:100% is required: .grid-container centers with margin:0 auto, and a
   flex item with auto cross-axis margins SHRINK-WRAPS instead of stretching
   (the wishlist page collapsed to one 350px column — caught 2026-07-31). */
body > .site { flex: 1 0 auto; }
/* Outranks GP's .container.grid-container { width: auto } (0,2,0). */
body > .site.grid-container { width: 100%; }
body > .site-footer { margin-top: auto; }

/* ---------------------------------------------------------
   Base element layer — scoped to the content area (.site-main).
   :where() keeps specificity at zero-class level so ANY component
   rule wins deterministically; page CSS should only carry layout
   and variants, never redeclare colors/typography.
   --------------------------------------------------------- */
/* Headings are SITE-WIDE uniform: one look per level, everywhere (header,
   content, footer). Pick hierarchy by tag level (h3 too big? use h4) — never
   by redeclaring size/weight in component CSS. Element specificity (0,0,1)
   beats GP's h1/h3 rules by load order; classed rules may only override
   color on dark surfaces (e.g. footer). */
/* One font for everything; components never declare their own stack. */
body, button, input, select, textarea {
	font-family: var(--bto-font-sans);
}

:is(h1, h2, h3, h4, h5, h6) {
	color: var(--bto-ink);
	line-height: 1.2;
	letter-spacing: -.02em;
}
h1 { font-size: var(--bto-fs-h1); font-weight: var(--bto-fw-h1); }
h2 { font-size: var(--bto-fs-h2); font-weight: var(--bto-fw-h2); }
h3 { font-size: var(--bto-fs-h3); font-weight: var(--bto-fw-h3); }
h4 { font-size: var(--bto-fs-h4); font-weight: var(--bto-fw-h4); }
:where(.site-main, .bto-home) label { color: var(--bto-ink-2); }
:where(.site-main, .bto-home) a { color: var(--bto-green); }

/* Form controls inherit one look. Specificity (0,1,1) outranks GP's bare
   element rules by load order, and any classed component rule loaded after
   this sheet still wins its ties. */
.site-main input:where(:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="file"]):not([type="hidden"])),
.bto-home input:where(:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="file"]):not([type="hidden"])),
.site-main select,
.bto-home select,
.site-main textarea,
.bto-home textarea {
	border: 1px solid var(--bto-border-strong);
	border-radius: var(--bto-radius-sm);
	padding: 9px 12px;
	font-size: 14px;
	color: var(--bto-ink);
	background-color: var(--bto-surface);
}
.site-main input:where(:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="file"]):not([type="hidden"])):focus,
.bto-home input:where(:not([type="checkbox"]):not([type="radio"]):not([type="range"]):not([type="submit"]):not([type="button"]):not([type="file"]):not([type="hidden"])):focus,
.site-main select:focus,
.bto-home select:focus,
.site-main textarea:focus,
.bto-home textarea:focus {
	border-color: var(--bto-green);
	box-shadow: var(--bto-focus-ring);
	outline: 0;
}

/* Every select carries the site chevron with breathing room before the
   border — BASE LAYER DEFAULT (대표 2026-08-04: the native arrow hugging
   the border kept resurfacing because each component had to opt in).
   Components with their own chevron simply override this. */
.site-main select,
.bto-home select {
	-webkit-appearance: none;
	appearance: none;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234c5254' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 12px center;
	background-size: 16px 16px;
	padding-right: 36px;
}

/* ---------------------------------------------------------
   Base components — buttons. Defined once here; templates adopt
   the classes and drop their per-component button CSS.
   Shape: radius-sm rectangle by default, --pill for round.
   --------------------------------------------------------- */
.bto-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
	border: 0; border-radius: var(--bto-radius-sm);
	padding: 13px 18px; font-size: 14px; font-weight: 600;
	cursor: pointer; text-decoration: none;
	transition: background-color .15s, color .15s, border-color .15s;
}
.bto-btn--pill { border-radius: 999px; }
.bto-btn--primary { background: var(--bto-green); color: var(--bto-green-fg); }
.bto-btn--primary:hover,
.bto-btn--primary:focus { background: var(--bto-green-hover); color: var(--bto-green-fg); }
.bto-btn--ghost { background: var(--bto-surface); color: var(--bto-green); border: 1px solid var(--bto-border-strong); }
.bto-btn--ghost:hover,
.bto-btn--ghost:focus { background: var(--bto-surface-2); color: var(--bto-green); }

/* Page canvas: white site-wide. Outranks the GP customizer body rule
   (--base-2 #f7f8f9); the home page keeps its ivory via home.css. */
body:not(.home):not(.bto-front) {
	background-color: var(--bto-canvas);
}

/* Content gutters — one place for every page (home carries its own via
   .bto-home). Same total side space as home: GP grid-container 20px + 24px.
   Outranks GP's dynamic ".separate-containers .site-main{margin:20px}" by
   load order. */
.separate-containers .site-main {
	margin: 28px 0 64px;
	padding: 0 24px;
}

/* WooCommerce account pages fill the content column, so GP's inner 30px
   .inside-article padding stacked on the .site-main gutter above reads as a
   huge double gutter. Drop it — the site-main gutter is the single source of
   side spacing, matching the listing/promotions pages. (0,2,1) body classes
   beat GP's (0,2,1) rule by load order. The custom cart page fills the column
   and the contact page fill the column the same way, matched via :has(). */
.woocommerce-account .inside-article,
.inside-article:has(.bto-cart, .bto-contact-form) {
	padding: 0;
}

.bto-gc {
	max-width: 1280px;
	margin: 0 auto;
	color: var(--bto-ink);
}

.bto-ic { width: 1.15em; height: 1.15em; flex: 0 0 auto; }

/* Breadcrumb */
.bto-gc-crumb {
	display: flex; flex-wrap: wrap; align-items: center; gap: .4rem;
	font-size: .86rem; color: var(--bto-muted); margin: .75rem 0 1rem;
}
.bto-gc-crumb a { color: var(--bto-ink-2); text-decoration: none; }
.bto-gc-crumb a:hover { text-decoration: underline; }
.bto-gc-crumb-cur { color: var(--bto-ink); font-weight: 600; }

/* Breadcrumb city menu — click the destination to jump to another listing */
.bto-city-menu { position: relative; }
.bto-city-menu > summary {
	display: inline-flex; align-items: center; gap: .15rem; cursor: pointer;
	list-style: none; color: var(--bto-ink-2);
}
.bto-city-menu > summary::-webkit-details-marker { display: none; }
.bto-city-menu > summary .bto-ic { width: 1em; height: 1em; }
.bto-city-menu[open] > summary { color: var(--bto-green); font-weight: 600; }
.bto-city-menu-pop {
	position: absolute; top: 100%; left: 0; z-index: 30; margin-top: .4rem;
	min-width: 240px; background: var(--bto-surface); border: 1px solid var(--bto-border);
	border-radius: var(--bto-radius-sm); box-shadow: 0 6px 20px rgba(0,0,0,.12); padding: .5rem;
	display: flex; flex-direction: column; gap: .1rem;
}
.bto-city-opt {
	padding: .5rem .7rem; border-radius: var(--bto-radius-sm); text-decoration: none;
	color: var(--bto-ink-2); font-size: .85rem;
}
.bto-city-opt:hover { background: var(--bto-surface-2); color: var(--bto-ink); }
.bto-city-opt.is-current { color: var(--bto-green); font-weight: 600; }

/* Grid */
.bto-gc-grid {
	display: grid; grid-template-columns: 2fr 1fr;
	column-gap: 2rem; row-gap: 2rem; align-items: start;
}
@media (max-width: 1024px) { .bto-gc-grid { grid-template-columns: 1fr; } }

.bto-gc-left { min-width: 0; }
.bto-gc-right { display: flex; flex-direction: column; gap: 1rem; }
/* Only the booking widget sticks (not the whole column) so the Location /
   Related cards below it are never clipped on short viewports. */
/* Booking widget scrolls with the page (sticky removed, 대표 2026-07-21). */
/* Mobile flow: media → title → chips → description → booking widget → the
   rest. display:contents lifts both columns' children into the single-column
   grid so the widget can interleave; explicit order pulls the intro first.
   Spacing comes from the items' own margins (row-gap off). */
@media (max-width: 1024px) {
	.bto-gc-grid { row-gap: 0; }
	.bto-gc-left, .bto-gc-right { display: contents; }
	.bto-gc-media { order: -5; }
	.bto-gc-titlewrap { order: -4; }
	.bto-gc-quick { order: -3; }
	.bto-gc-desc { order: -2; }
	.bto-gc-right > .bto-bw { order: -1; margin-top: 2.5rem; }
	.bto-gc-right > .bto-sidecard { margin-top: 2rem; }
	/* 380px is the desktop sidebar width; stacked items go full width. */
	.bto-gc-right > .bto-bw,
	.bto-gc-right > .bto-sidecard { max-width: none; }
}

/* Hero */
.bto-gc-hero {
	position: relative; border-radius: var(--bto-radius); overflow: hidden;
	min-height: 360px; background-size: cover; background-position: center;
	background-color: var(--bto-surface-2);
	display: flex; align-items: flex-end;
}
@media (max-width: 640px) { .bto-gc-hero { min-height: 240px; } }
.bto-gc-hero.is-empty { background-image: linear-gradient(135deg, #d8ede2, #b9dccb); }
.bto-gc-hero[data-open-gallery] { cursor: pointer; }
.bto-gc-hero-shade {
	position: absolute; inset: 0;
	background: linear-gradient(to top, rgba(0,0,0,.62) 0%, rgba(0,0,0,.15) 45%, rgba(0,0,0,0) 70%);
}
.bto-gc-hero-body { position: relative; padding: 1.5rem 1.75rem; color: #fff; }
.bto-gc-hero-title { margin: 0; color: #fff; font-size: 2rem; line-height: 1.15; text-shadow: 0 1px 4px rgba(0,0,0,.55); }
@media (max-width: 640px) { .bto-gc-hero-title { font-size: 1.5rem; } }
.bto-gc-hero-loc { margin: .5rem 0 0; display: inline-flex; align-items: center; gap: .35rem; font-size: .95rem; opacity: .98; text-shadow: 0 1px 3px rgba(0,0,0,.55); }
.bto-view-gallery {
	position: absolute; right: 1rem; bottom: 1rem;
	display: inline-flex; align-items: center; gap: .4rem;
	background: rgba(0,0,0,.6); color: #fff; border: 0; border-radius: var(--bto-radius-sm);
	padding: .5rem .85rem; font-size: .85rem; cursor: pointer; backdrop-filter: blur(2px);
}
.bto-view-gallery:hover { background: rgba(0,0,0,.78); }
/* On small screens the title spans the bottom band, so lift the button to the
   top-right to avoid overlapping a long course name. */
@media (max-width: 640px) { .bto-view-gallery { top: .75rem; bottom: auto; } }

/* Quick facts */
.bto-gc-quick { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1.1rem 0 0; }
.bto-gc-qf {
	display: inline-flex; align-items: center; gap: .3rem;
	border: 1px solid var(--bto-border); border-radius: 999px;
	padding: .30rem .6rem; font-size: .85rem; color: var(--bto-ink-2);
}
.bto-gc-qf .bto-ic { color: var(--bto-green); }
/* Free cancellation — the selling point chip (대표 2026-08-05): filled soft
   green so it pops out of the neutral chip row. */
.bto-gc-qf--cancel {
	background: var(--bto-green-soft);
	border-color: var(--bto-green-soft);
	color: var(--bto-green); font-weight: 600;
}

/* Media block (hero image + gallery strip) */
.bto-gc-media { margin-bottom: 2rem; }
.bto-gc-media .bto-gallery-grid { margin-top: .75rem; }

/* Title block — name (left) + city (right) on one line, below the hero */
.bto-gc-titlewrap { margin-top: 1.1rem; display: flex; align-items: baseline; flex-wrap: wrap; gap: .35rem 1rem; }
.bto-gc-title { margin: 0; } /* size/weight/color come from the base heading layer */
/* English original under the Korean course name (detail page, ko locale). */
.bto-gc-title-en { display: block; font-size: 1rem; font-weight: 500; color: var(--bto-muted); letter-spacing: 0; margin-top: 2px; }
@media (max-width: 640px) { .bto-gc-title { font-size: 1.5rem; } }
.bto-gc-loc { margin: 0 0 0 auto; display: inline-flex; align-items: center; gap: .35rem; font-size: .95rem; color: var(--bto-ink-2); }
.bto-gc-loc .bto-ic { color: var(--bto-green); }
@media (max-width: 640px) { .bto-gc-loc { margin-left: 0; } }

.bto-gc-desc { margin: 1.1rem 0 0; line-height: 1.7; color: var(--bto-ink); font-size: 1rem; }

/* Section block */
.bto-gc-block { margin-top: 3rem; }
.bto-gc-h2 {
	margin: 0 0 1.1rem; /* size/weight come from the base heading layer */
}

/* Course Information — icon grid */
.bto-gc-infogrid {
	display: grid; grid-template-columns: repeat(5, 1fr); gap: .75rem;
}
@media (max-width: 900px) { .bto-gc-infogrid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 520px) { .bto-gc-infogrid { grid-template-columns: repeat(2, 1fr); } }
.bto-gc-infocard {
	display: flex; align-items: center; gap: .6rem;
	border: 1px solid var(--bto-border); border-radius: var(--bto-radius-sm); padding: .75rem .8rem;
}
.bto-gc-infoic { color: var(--bto-green); display: inline-flex; }
.bto-gc-infoic .bto-ic { width: 22px; height: 22px; }
.bto-gc-infotext { display: flex; flex-direction: column; min-width: 0; }
.bto-gc-infolabel { font-size: .85rem; color: var(--bto-green); text-transform: uppercase; line-height: 1.2; }
.bto-gc-infoval { font-size: .92rem; font-weight: 400; color: var(--bto-ink); word-break: break-word; line-height: 1.2; }

/* Playing Policies */
.bto-gc-policies { display: flex; flex-direction: column; gap: 1rem; }
.bto-gc-policy { display: flex; gap: .8rem; }
.bto-gc-policy-ic { color: var(--bto-green); flex: 0 0 auto; margin-top: .1rem; }
.bto-gc-policy-ic .bto-ic { width: 20px; height: 20px; }
.bto-gc-policy-body { display: flex; flex-direction: column; gap: .2rem; min-width: 0; }
.bto-gc-policy-title { font-weight: 600; }
.bto-gc-policy-text { color: var(--bto-ink-2); line-height: 1.6; font-size: .92rem; }

/* Facilities — check icons */
.bto-gc-facs {
	display: grid; grid-template-columns: repeat(4, 1fr); gap: .2rem .5rem;
}
@media (max-width: 520px) { .bto-gc-facs { grid-template-columns: repeat(2, 1fr); } }
.bto-gc-fac { display: inline-flex; align-items: center; gap: .5rem; font-size: .92rem; }
.bto-gc-fac .bto-ic { width: 18px; height: 18px; color: var(--bto-green); }
/* Unavailable facility — dimmed with a circle-✕ icon */
.bto-gc-fac.is-off { color: var(--bto-muted); opacity: .5; }
.bto-gc-fac.is-off .bto-ic { color: var(--bto-muted); }

/* Operating Hours — daytype cards (structural layout only; visual polish deferred to design session) */
.bto-gc-hours { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
@media (max-width: 720px) { .bto-gc-hours { grid-template-columns: 1fr; } }
.bto-gc-hours-card { border: 1px solid var(--bto-border); border-radius: var(--bto-radius-sm); padding: .8rem .9rem; }
.bto-gc-hours-day { display: flex; align-items: center; gap: .45rem; font-weight: 500; color: var(--bto-ink); margin-bottom: .5rem; text-transform: uppercase;  }
.bto-gc-hours-day .bto-ic { width: 18px; height: 18px; }
.bto-gc-hours-dl { margin: 0; display: flex; flex-direction: column; gap: .2rem; }
.bto-gc-hours-dl > div { display: flex; justify-content: space-between; gap: 1rem; font-size: .88rem; }
/* Same label voice as the course-info cards: green, regular, uppercase. */
.bto-gc-hours-dl dt { color: var(--bto-green); font-size: .87rem; font-weight: 400; text-transform: uppercase; letter-spacing: .02em; margin: 0; }
.bto-gc-hours-dl dd { margin: 0; color: var(--bto-ink); font-weight: 500; text-align: right; }

.bto-gc-gallery-wrap { margin-top: 2.5rem; }

/*
---------------------------------------------------------
Sidebar cards (Location, Related) — match booking widget shell
---------------------------------------------------------
*/
.bto-sidecard {
	width: 100%; max-width: 380px;
	border: 1px solid var(--bto-border); border-radius: var(--bto-radius); background: var(--bto-surface); /* match course-info card border weight */
	overflow: hidden; box-shadow: var(--bto-shadow-1);
	box-sizing: border-box; color: var(--bto-ink);
}
/* Title sits close to its content — the 14+14px head/body stack read as a
   hole under every card title (대표 2026-08-04, Location + Related alike). */
.bto-sidecard-head { background: var(--bto-surface); color: var(--bto-ink); padding: 14px 18px 6px; margin: 0; } /* size/weight from the h3 tokens; ink like every section heading (대표 2026-08-04) */
.bto-sidecard-body { padding: 8px 18px 14px; }

/* Location */
.bto-location-map {
	border-radius: var(--bto-radius-sm); overflow: hidden; aspect-ratio: 16 / 10; background: var(--bto-surface-2); margin-bottom: .8rem;
}
/* Google's embed UI (footer strip, map-type thumbnail, fullscreen control)
   lives inside the iframe and hugs its edges — it can't be styled from here.
   So the iframe renders oversized and the wrapper windows its CENTER: every
   edge-anchored control falls outside the crop, and the pin (q= centers it)
   stays centered (대표 2026-08-04). */
.bto-location-map { position: relative; }
.bto-location-map iframe {
	position: absolute; top: 50%; left: 50%;
	width: 145%; height: 155%;
	transform: translate(-50%, -50%);
	border: 0; display: block;
}
.bto-location-addr { margin: 0 0 .7rem; font-size: .88rem; color: var(--bto-ink-2); line-height: 1.5; }
/* Visuals come from .bto-btn--ghost. */
.bto-location-link .bto-ic { width: 15px; height: 15px; }
/* One row, pinned to the card's left/right edges; compact buttons
   (대표 2026-08-04 — applies to the golf detail's Location card too). */
.bto-location-links { display: flex; flex-direction: row; justify-content: space-between; gap: .5rem; align-items: center; }
.bto-location-links .bto-btn { padding: 6px 10px; font-size: 12.5px; }

/* Location — Access rows (distance / travel time) */
.bto-location-access { list-style: none; margin: 0 0 .8rem; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.bto-location-access li { display: flex; align-items: center; gap: .5rem; font-size: .85rem; }
.bto-location-access .bto-ic { width: 16px; height: 16px; color: var(--bto-green); flex: 0 0 auto; }
.bto-access-label { color: var(--bto-muted); }
.bto-access-val { margin-left: auto; font-weight: 500; color: var(--bto-ink); text-align: right; }

/* Related courses */
.bto-related-item {
	display: flex; gap: .75rem; align-items: center; padding: .6rem 0;
	text-decoration: none; color: inherit; border-top: 1px solid var(--bto-border);
}
.bto-related-item:first-child { border-top: 0; padding-top: 0; }
.bto-related-thumb {
	width: 68px; height: 52px; flex: 0 0 auto; border-radius: var(--bto-radius-sm);
	background-size: cover; background-position: center; background-color: var(--bto-surface-2);
}
.bto-related-meta { display: flex; flex-direction: column; gap: .1rem; min-width: 0; }
.bto-related-name { font-weight: 600; font-size: .9rem; line-height: 1.25; }
.bto-related-loc { font-size: .8rem; color: var(--bto-muted); }
.bto-related-price { font-size: .82rem; color: var(--bto-green); font-weight: 600; }

/*
---------------------------------------------------------
Global header + footer (inc/header-footer.php)
Approved design 2026-07-17 — ivory translucent sticky header,
dark-green 4-column footer, floating support chat.
---------------------------------------------------------
*/

/* ---------- header ---------- */

.bto-header {
	position: sticky; top: 0; z-index: 90;
	background: #ffffff;
	backdrop-filter: blur(14px); -webkit-backdrop-filter: blur(14px);
	border-bottom: 1px solid rgba(28, 29, 31, .06);
}
.bto-hd-wrap {
	max-width: 1200px; margin: 0 auto; padding: 0 24px;
	display: flex; align-items: center;
	gap: 18px; height: var(--bto-header-h);
}
/* Logo left; menu + utility icons grouped on the right. */
.bto-hd-menu { margin-left: auto; }

.bto-logo {
	display: flex; align-items: center; gap: 8px; flex: 0 0 auto;
	font-size: 20px; font-weight: 800; letter-spacing: -.03em;
	color: var(--bto-ink); text-decoration: none;
    margin-top: -10px;
}
.bto-logo:hover, .bto-logo:focus { color: var(--bto-ink); }
.bto-logo-mark {
	width: 32px; height: 32px; border-radius: 50%;
	background: var(--bto-ink); color: #fff;
	display: flex; align-items: center; justify-content: center;
}
.bto-logo-mark svg { width: 16px; height: 16px; }

.bto-hd-menu-list {
	display: flex; gap: 26px; list-style: none; margin: 0; padding: 0;
	font-size: 16px; font-weight: 500;
}
.bto-hd-menu-list a { color: var(--bto-ink); text-decoration: none; text-transform: uppercase; }
.bto-hd-menu-list a:hover { color: var(--bto-ink-2); }
.bto-hd-menu-list .current-menu-item > a,
.bto-hd-menu-list .current_page_item > a { color: var(--bto-ink); font-weight: 900; }

.bto-hd-right { display: flex; align-items: center; gap: 6px; flex: 0 0 auto; }
.bto-hd-ic {
	position: relative; display: flex; align-items: center; justify-content: center;
	width: 38px; height: 38px; border-radius: 50%;
	color: var(--bto-ink-2); text-decoration: none;
}
.bto-hd-ic:hover { background: rgba(28, 29, 31, .06); color: var(--bto-ink); }
.bto-hd-ic svg { width: 20px; height: 20px; }
/* Wider than the circular icon buttons — pill radius so the hover background
   doesn't stretch the 50% circle into an ellipse. */
.bto-hd-lang { width: auto; padding: 0 10px; gap: 5px; border-radius: 999px; font-size: 12.5px; font-weight: 600; letter-spacing: .02em; cursor: pointer; list-style: none; }
.bto-hd-lang::-webkit-details-marker { display: none; }

/* ---------- language / currency switcher ---------- */

.bto-hd-lang-switch { position: relative; }
/* Image wordmark logo — header 40px, footer 28px (white silhouette on dark) */
.bto-logo img { height: 40px; width: auto; display: block; }
.bto-ft-brand .bto-logo img { height: 28px; filter: brightness(0) invert(1); }

/* Footer variant of the switcher: link tone on dark green, opens upward. */
.bto-ft-lang-switch > summary.bto-hd-lang {
	width: auto; height: auto; border-radius: 999px; padding: 4px 10px;
	color: #b9dcca;
}
.bto-ft-lang-switch > summary.bto-hd-lang:hover { background: rgba(255, 255, 255, .08); color: #fff; }
.bto-ft-lang-switch .bto-hd-lang-pop { top: auto; bottom: calc(100% + 8px); }
.bto-hd-lang-pop {
	position: absolute; top: calc(100% + 8px); right: 0; z-index: 120;
	min-width: 180px; padding: 12px 14px;
	background: var(--bto-surface);
	border: 1px solid var(--bto-border);
	border-radius: var(--bto-radius);
	box-shadow: var(--bto-shadow-2);
	display: flex; flex-direction: column; gap: 10px;
}
.bto-switch-group { display: flex; flex-direction: column; gap: 2px; }
.bto-switch-title {
	font-size: 11px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase;
	color: var(--bto-muted); margin-bottom: 3px;
}
.bto-switch-group a,
.bto-switch-group button {
	display: block; width: 100%; text-align: left;
	padding: 7px 9px; border: 0; border-radius: calc(var(--bto-radius) - 4px);
	background: none; cursor: pointer;
	font-size: 13.5px; font-weight: 500; color: var(--bto-ink-2); text-decoration: none;
}
.bto-switch-group a:hover,
.bto-switch-group button:hover { background: rgba(28, 29, 31, .06); color: var(--bto-ink); }
.bto-switch-group a.is-on,
.bto-switch-group button.is-on { color: var(--bto-green); font-weight: 700; }

.bto-drawer-lang { align-items: center; }
.bto-drawer-lang-links, .bto-drawer-cur { display: inline-flex; gap: 4px; }
.bto-drawer-lang a,
.bto-drawer-cur button {
	padding: 5px 9px; border: 1px solid var(--bto-border); border-radius: 999px;
	background: none; cursor: pointer;
	font-size: 12.5px; font-weight: 600; color: var(--bto-ink-2); text-decoration: none;
}
.bto-drawer-lang a.is-on,
.bto-drawer-cur button.is-on { border-color: var(--bto-green); color: var(--bto-green); }

.bto-cart-badge {
	position: absolute; top: 2px; right: 0;
	min-width: 16px; height: 16px; padding: 0 4px; border-radius: 999px;
	background: var(--bto-green); color: #fff;
	font-size: 10.5px; font-weight: 700; line-height: 1;
	display: flex; align-items: center; justify-content: center;
}
.bto-cart-badge[hidden] { display: none; }

.bto-hd-burger {
	display: none; width: 40px; height: 40px; border: 0; padding: 0;
	background: none; cursor: pointer; color: var(--bto-ink);
	align-items: center; justify-content: center;
}
.bto-hd-burger svg { width: 22px; height: 22px; }

/* ---------- mobile drawer ---------- */

/* Hotel search panel — toggled open by the Hotels menu item; sticks just
   under the sticky header (대표 2026-08-04). The bar itself is core's shared
   stay-bar component (hotel-stay.css). */
/* Fixed OVERLAY under the header — it floats above the page instead of
   pushing the content down (대표 2026-08-04). */
.bto-hd-hotelpanel {
	position: fixed; top: var(--bto-header-h); left: 0; right: 0; z-index: 90;
	background: var(--bto-surface);
	/* No border-bottom — the scrim already separates the panel from the
	   page, and the extra line read as clutter (대표 2026-08-04). */
}
.bto-hd-hotelpanel[hidden] { display: none; }
.bto-hd-hotelpanel-in { max-width: 1280px; margin: 0 auto; padding: 24px 24px 28px; }

/* Page-dimming scrim under the open panel — tap it to close (대표 2026-08-04). */
.bto-hd-hotelscrim {
	position: fixed; inset: 0; top: var(--bto-header-h); z-index: 89;
	background: rgba(0, 0, 0, .45); /* overlay — alpha-overlay exception family */
}
.bto-hd-hotelscrim[hidden] { display: none; }
.bto-hd-hotelpanel .bto-ht-stay { margin-bottom: 0; }
.bto-hd-hotelpanel .bto-hp-nameseg { flex: 2 1 0; position: relative; }
/* Brand-green bar (2026-08-05): placeholder reads on green. */
.bto-hd-hotelpanel .bto-hp-nameseg input::placeholder {
	color: color-mix( in srgb, var(--bto-green-fg) 65%, transparent );
	font-weight: 500;
}

/* Suggest dropdown — a quiet card under the name segment (2+ chars, ≤8 rows). */
.bto-hp-suggest {
	position: absolute; top: 100%; left: 0; right: 0; z-index: 95;
	background: var(--bto-surface);
	border: 1px solid var(--bto-border);
	border-radius: var(--bto-radius-sm);
	box-shadow: var(--bto-shadow-2);
	overflow: hidden;
	text-transform: none;
}
.bto-hp-suggest button {
	display: flex; align-items: center; justify-content: space-between; gap: 12px;
	width: 100%; text-align: left;
	padding: 10px 14px; border: 0; background: none; cursor: pointer;
	font-size: 14px; font-weight: 500; color: var(--bto-ink);
}
.bto-hp-suggest button:hover { background: var(--bto-surface-2); }
/* Row tag: 지역/호텔 — tells the two suggestion kinds apart at a glance. */
.bto-hp-suggest button small {
	font-size: 11px; font-weight: 600; letter-spacing: .03em; text-transform: uppercase;
	color: var(--bto-muted); background: var(--bto-surface-2);
	border-radius: 999px; padding: 2px 8px; flex: 0 0 auto;
}
.bto-hd-hotelpanel .bto-hp-cityseg { flex: 1.1 1 0; }
@media (max-width: 860px) {
	.bto-hd-hotelpanel .bto-hp-nameseg { flex: 1 1 100%; border-left: 0; }
}

.bto-drawer { position: fixed; inset: 0; z-index: 110; }
.bto-drawer[hidden] { display: none; }
.bto-drawer-locked { overflow: hidden; }
.bto-drawer-scrim { position: absolute; inset: 0; background: rgba(2, 40, 28, .45); }
.bto-drawer-panel {
	position: absolute; top: 0; right: 0; bottom: 0; width: min(320px, 85vw);
	background: var(--bto-ivory); padding: 22px 24px;
	display: flex; flex-direction: column;
	box-shadow: -12px 0 40px rgba(2, 40, 28, .25);
}
.bto-drawer-x {
	align-self: flex-end; width: 36px; height: 36px; border: 0; padding: 0;
	background: none; cursor: pointer; color: var(--bto-ink-2);
}
.bto-drawer-x svg { width: 22px; height: 22px; }
.bto-drawer-list { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.bto-drawer-list a {
	display: block; padding: 12px 8px; font-size: 16px; font-weight: 600;
	color: var(--bto-ink); text-decoration: none;
	border-bottom: 1px solid rgba(28, 29, 31, .06);
}
.bto-drawer-list .current-menu-item > a { color: var(--bto-green); }
.bto-drawer-sub { display: flex; flex-direction: column; gap: 4px; margin-top: 14px; }
.bto-drawer-sub a, .bto-drawer-lang {
	display: flex; align-items: center; gap: 9px; padding: 9px 8px;
	font-size: 13.5px; font-weight: 500; color: var(--bto-ink-2); text-decoration: none;
}
.bto-drawer-sub svg { width: 17px; height: 17px; }
.bto-drawer-sub .bto-cart-badge { position: static; }
/* Visuals come from .bto-btn--primary --pill; only drawer layout here. */
.bto-drawer-cta { margin-top: auto; padding: 13px; font-size: 14px; }

@media (max-width: 900px) {
	/* Hide the HEADER switcher only (drawer covers it); the footer variant stays. */
	.bto-hd-menu, .bto-hd-right .bto-hd-lang-switch { display: none; }
	/* The menu normally carries the margin-left:auto that pushes the icon
	   group right; with it hidden, the icons take over. */
	.bto-hd-right { margin-left: auto; }
	.bto-hd-burger { display: flex; }
}

/* ---------- footer ---------- */
/* Intentional exception: the footer's on-dark-green text scale (#b9dcca,
   #9ccab2, #8cc4a7, #cfe9db, #eef7f2) is a component-scoped palette derived
   from footer-green — not global tokens. Manage it here only. */

.bto-footer { background: var(--bto-footer-green); color: #b9dcca; }
.bto-ft-wrap { max-width: 1200px; margin: 0 auto; padding: 0 24px; }
.bto-ft-cols {
	display: grid; grid-template-columns: 1.4fr 1fr 1fr 1.1fr;
	gap: 36px; padding: 44px 0 36px;
}
.bto-ft-brand .bto-logo { color: #eef7f2; font-size: 17px; }
.bto-ft-brand .bto-logo-mark { width: 28px; height: 28px; background: rgba(255, 255, 255, .14); }
.bto-ft-brand .bto-logo-mark svg { width: 14px; height: 14px; }
.bto-ft-brand p { font-size: 13px; line-height: 1.7; margin: 12px 0 0; color: #9ccab2; }
/* Only the on-dark color deviates; size/weight come from the h4 tokens. */
.bto-ft-col h4 { color: #ffffff; margin: 0 0 14px; }
.bto-ft-col a, .bto-ft-col button.bto-ft-chat {
	display: block; padding: 5px 0; font-size: 14px;
	color: #cfe9db; text-decoration: none;
}
.bto-ft-col a:hover, .bto-ft-col button.bto-ft-chat:hover { color: #fff; }
.bto-ft-chat { display: flex !important; align-items: center; gap: 8px; }
button.bto-ft-chat { background: none; border: 0; cursor: pointer; text-align: left; width: 100%; }
.bto-ft-chat svg { width: 16px; height: 16px; flex: 0 0 auto; color: #8cc4a7; }
.bto-ft-sos { font-size: 13px; line-height: 1.6; color: #8cc4a7; margin: 12px 0 0; }

/* Brand-column contact rows (address, phone) */
.bto-ft-contact { margin-top: 16px; display: flex; flex-direction: column; gap: 9px; font-size: 12.5px; line-height: 1.55; color: #9ccab2; max-width: 34ch; }
.bto-ft-contact > div { display: flex; gap: 9px; align-items: flex-start; }
.bto-ft-contact svg { width: 15px; height: 15px; flex: 0 0 auto; margin-top: 2px; color: #8cc4a7; }
.bto-ft-contact a { color: #cfe9db; text-decoration: none; font-weight: 600; }
.bto-ft-contact a:hover { color: #fff; }
.bto-ft-contact small { display: block; font-size: 11.5px; color: #8cc4a7; }

/* Footer course search — quiet pill on the dark green (top of Explore) */
.bto-ft-search {
	margin: 12px 0 0; display: flex; align-items: center;
	background: rgba(255, 255, 255, .10); border: 1px solid rgba(255, 255, 255, .16);
	border-radius: 999px; padding: 3px 3px 3px 14px;
}
.bto-ft-search input {
	flex: 1; min-width: 0; background: transparent; border: 0; outline: 0;
	font-size: 12.5px; color: #eef7f2; padding: 6px 0;
}
.bto-ft-search input::placeholder { color: #8cc4a7; }
.bto-ft-search button {
	width: 28px; height: 28px; flex: 0 0 auto; border: 0; border-radius: 50%;
	padding: 0; line-height: 0; appearance: none; -webkit-appearance: none;
	background: var(--bto-green); color: #fff; cursor: pointer;
	display: flex; align-items: center; justify-content: center;
}
.bto-ft-search button:hover { background: var(--bto-green-hover); }
.bto-ft-search button svg { width: 14px; height: 14px; display: block; flex: 0 0 auto; }

/* Accepted-payment chips (intentional literals: third-party brand marks) */
.bto-ft-pay { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; justify-content: center; }
.bto-pay {
	height: 26px; min-width: 46px; padding: 0 9px;
	background: #fff; border-radius: 5px;
	display: inline-flex; align-items: center; justify-content: center;
	font-size: 10.5px; font-weight: 800; letter-spacing: .02em; line-height: 1;
}
.bto-pay-onepay { color: #0053a0; }
.bto-pay-visa { color: #1a1f71; font-style: italic; font-size: 12px; }
.bto-pay-mc i { width: 15px; height: 15px; border-radius: 50%; background: #eb001b; }
.bto-pay-mc i + i { background: #f79e1b; margin-left: -6px; opacity: .92; }
.bto-pay-jcb { gap: 2px; }
.bto-pay-jcb i { width: 5px; height: 14px; border-radius: 2px; }
.bto-pay-jcb i:nth-child(1) { background: #0e4c96; }
.bto-pay-jcb i:nth-child(2) { background: #d0203c; }
.bto-pay-jcb i:nth-child(3) { background: #199d4e; }
.bto-pay-amex { background: #2e77bc; color: #fff; }
/* Company / policy links row (PSP review requirement: reachable everywhere) */
.bto-ft-legal {
	border-top: 1px solid rgba(255, 255, 255, .10); padding: 14px 0;
	display: flex; align-items: center; justify-content: center;
	flex-wrap: wrap; gap: 6px 24px;
}
.bto-ft-legal a { font-size: 13px; color: #cfe9db; text-decoration: none; }
.bto-ft-legal a:hover { color: #fff; }

.bto-ft-bar {
	border-top: 1px solid rgba(255, 255, 255, .10); padding: 16px 0;
	display: flex; align-items: center; justify-content: space-between;
	flex-wrap: wrap; gap: 8px; font-size: 12.5px; color: #8cc4a7;
}

@media (max-width: 760px) {
	.bto-ft-cols { grid-template-columns: 1fr; gap: 0; padding: 36px 0 28px; }
	/* Stacked sections read as one block without separators — divide them with
	   the same hairline as the legal / bottom bars above. */
	.bto-ft-cols > * + * {
		border-top: 1px solid rgba(255, 255, 255, .10);
		margin-top: 24px;
		padding-top: 24px;
	}
	.bto-ft-bar { flex-direction: column; text-align: center; }
}

/* ---------- policy pages (Template Name: Policy Page) ---------- */

.bto-policy-hero { max-width: 1120px; margin: 0 auto; padding: 44px 24px 0; }
.bto-policy-hero h1 { margin: 0; }
.bto-policy-meta { margin: 10px 0 0; font-size: 13px; color: var(--bto-muted); }

.bto-policy {
	max-width: 1120px; margin: 0 auto; padding: 28px 24px 80px;
	display: grid; grid-template-columns: 236px minmax(0, 1fr);
	gap: 56px; align-items: start;
}

/* Left rail — sticky in-page nav */
.bto-policy-side { position: sticky; top: calc(var(--bto-header-h) + 28px); }
.bto-policy-toc-t {
	display: block; margin: 0 0 10px; padding-left: 14px;
	font-size: 14px; font-weight: 600; letter-spacing: .08em;
	text-transform: uppercase; color: var(--bto-muted);
}
.bto-policy-toc a {
	display: block; padding: 7px 14px;
	font-size: 16px; line-height: 1.45; color: var(--bto-ink);
	text-decoration: none; border-left: 2px solid var(--bto-border);
}
.bto-policy-toc a:hover { color: var(--bto-green); background: var(--bto-surface-2); }
.bto-policy-toc a.is-on { color: var(--bto-green); font-weight: 600; border-left-color: var(--bto-green); }

/* Reading column — measured, roomy */
.bto-policy-body { max-width: 760px; font-size: 15.5px; line-height: 1.75; color: var(--bto-ink); }
.bto-policy-body > h2 { margin: 44px 0 14px; scroll-margin-top: calc(var(--bto-header-h) + 28px); }
.bto-policy-body > h2:not(:first-of-type) { border-top: 1px solid var(--bto-border); padding-top: 32px; }
.bto-policy-body h3 { margin: 28px 0 10px; }
.bto-policy-body p { margin: 0 0 14px; }
.bto-policy-body ul, .bto-policy-body ol { margin: 0 0 16px; padding-left: 22px; }
.bto-policy-body li { margin: 7px 0; }
.bto-policy-body li::marker { color: var(--bto-green); }
.bto-policy-body a { text-decoration: underline; text-underline-offset: 2px; }
.bto-policy-body .wp-block-image { margin: 20px auto; max-width: 520px; }
.bto-policy-body .wp-block-image img {
	display: block; width: 100%; height: auto;
	border: 1px solid var(--bto-border); border-radius: var(--bto-radius);
	box-shadow: var(--bto-shadow-1);
}

/* Mobile: rail becomes a disclosure above the text */
.bto-policy-tocbox { display: none; }

@media (max-width: 900px) {
	.bto-policy { grid-template-columns: 1fr; gap: 0; }
	.bto-policy-side { display: none; }
	.bto-policy-tocbox {
		display: block; margin: 0 0 24px;
		border: 1px solid var(--bto-border); border-radius: var(--bto-radius);
		background: var(--bto-surface);
	}
	.bto-policy-tocbox summary {
		padding: 12px 16px; cursor: pointer;
		font-size: 13.5px; font-weight: 600; color: var(--bto-ink);
	}
	.bto-policy-tocbox .bto-policy-toc { padding: 0 10px 10px; }
	.bto-policy-tocbox .bto-policy-toc a { border-left: 0; border-radius: var(--bto-radius-sm); }
}

/* ---------- floating support chat ---------- */

.bto-fab {
	position: fixed; right: 22px; bottom: 22px; z-index: 100;
	display: flex; flex-direction: column; align-items: flex-end; gap: 10px;
}
.bto-fab-btn {
	width: 56px; height: 56px; border-radius: 50%; border: 0; cursor: pointer;
	background: var(--bto-green); color: var(--bto-green-fg);
	display: flex; align-items: center; justify-content: center;
	box-shadow: 0 8px 24px rgba(2, 78, 51, .35);
}
.bto-fab-btn:hover { transform: translateY(-1px); }
.bto-fab-btn svg { width: 26px; height: 26px; }
.bto-fab-pop {
	display: flex; flex-direction: column; gap: 6px; width: 238px; padding: 14px;
	background: var(--bto-surface); border: 1px solid var(--bto-border); border-radius: var(--bto-radius);
	box-shadow: var(--bto-shadow-3);
}
.bto-fab-pop[hidden] { display: none; }
.bto-fab-title { font-size: 13px; font-weight: 700; color: var(--bto-ink); }
.bto-fab-sub { font-size: 11.5px; color: var(--bto-muted); line-height: 1.5; margin-bottom: 8px; }
.bto-fab-pop a, .bto-fab-pop button {
	display: flex; align-items: center; gap: 10px; padding: 10px 12px;
	border: 0; border-radius: var(--bto-radius-sm); background: none; cursor: pointer;
	font-size: 13.5px; font-weight: 600; color: var(--bto-ink);
	text-decoration: none; text-align: left;
}
.bto-fab-pop a:hover, .bto-fab-pop button:hover { background: var(--bto-surface-2); }
.bto-fab-dot {
	width: 30px; height: 30px; border-radius: 50%; flex: 0 0 auto;
	display: flex; align-items: center; justify-content: center; color: #fff;
}
.bto-fab-dot svg { width: 16px; height: 16px; }
.bto-fab-dot-chat { background: var(--bto-green); }
.bto-fab-dot-mail { background: var(--bto-ink-2); }

@media (max-width: 760px) {
	.bto-fab { right: 14px; bottom: 14px; }
}
