/* ============================================================
   1017_new_v1 — stylesheet
   ============================================================ */

:root {--acc-d: #0f766e; --bg: #f4f6f6;}/* ============================================================
   1017_new_v1 — stylesheet
   ============================================================ */

:root {--band: 62rem; --rad-s: 8px; --sh-l: 0 16px 50px rgba(20, 32, 29, 0.18); --text: #46535a; --ink: #16221f; --max: 70rem; --rad: 12px; --night: #14201d; --night-2: #1d2c28; --sh: 0 1px 2px rgba(20, 32, 29, 0.04), 0 6px 24px rgba(20, 32, 29, 0.06); --on-night: rgba(255, 255, 255, 0.6); --text-font: "Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif; --bg-2: #fafbfb; --card: #ffffff; --acc: #0d9488; --dim: #79868c; --edge: #e5e9e9; --read: 45rem; --edge-2: #eef1f1; --tint: rgba(13, 148, 136, 0.08); --display: "Sora", system-ui, sans-serif; --acc-l: #2bb3a3;}

*, *::before, *::after {margin:0; box-sizing: border-box; padding:0em;}

html {scroll-behavior: smooth; font-size:113%; -webkit-text-size-adjust:100%;}body{color: var(--text); -webkit-font-smoothing:antialiased; font-size:1.08rem; font-family: var(--text-font); line-height:1.72; -moz-osx-font-smoothing:grayscale; background: var(--bg);}img, svg{display: block; max-width:100%;}
ul, ol {list-style: none;}a:hover{color: var(--acc-d);}
a {text-decoration:none; color: var(--acc);}button{cursor: pointer; font-family:inherit;}

:focus-visible {outline-offset:2px; border-radius:1px; outline: 2px solid var(--acc);}
h1 {color: var(--ink); line-height:1.18; font-family: var(--display); letter-spacing:-0.015em; font-weight:700;}

.tableDetail {overflow: hidden; margin:-1px; position: absolute; white-space: nowrap; border:0; clip:rect(0, 0, 0, 0); padding:0; width:1px; height:1px;}
.screen-number + .widget-slot {position:sticky; text-transform:capitalize}


/* span headings (no h2/h3 anywhere but article content) */
.priceHolder, .px-2, .priceDate, .statusPlaceholder, .screenIndicator {letter-spacing:-0.01em; display: block; font-weight:bold; color: var(--ink); font-family: var(--display);}
.priceHolder {margin-bottom:1.15rem; font-size:1.3rem; will-change:auto;}
.px-2 {font-size:1.1rem; margin-bottom:0.27rem;}

/* ---------- scroll progress ---------- */
.cardExtra {-webkit-hyphens:manual;-ms-hyphens:manual;top:0; background: var(--acc); transition:width 0.066s linear; left:0; z-index: 1200; hyphens:manual; word-spacing:normal; height:5px; width:0; position: fixed;}html .priceDate{font-size:1.17rem; margin-bottom:1.28rem;}

/* ---------- topbar ---------- */
.actionCap {background:rgba(255, 255, 255, 0.8); backdrop-filter:saturate(150%) blur(8px); top:0; border-bottom: 1px solid var(--edge); z-index: 1000; position: sticky;}
.overflow-3 {align-items: center; display: inline-flex;}
.stepperInfo {perspective:none; max-width: var(--max); justify-content: space-between; min-height:3.94rem; align-items: center; padding:0 1.28rem; gap:0.99rem; margin-inline:auto; width:100%; display: flex;}
.overflow-3 img {width:auto; height:27px;}

.block__separator--odd {flex-direction: column; display: none; background:none; gap:8px; padding:0.46rem; border:0rem;}
.list--elevated {flex:none; overflow:visible; border:0; transition:all 0.2s ease}

.media-date .action-number {font-weight:600; min-height:100vh; overflow:visible}

.block__separator--odd span {display: block; height:2px; background: var(--ink); width:26px; border-top-left-radius:2px;border-top-right-radius:2px;border-bottom-right-radius:2px;border-bottom-left-radius:2px;}.t-filter-section{display: flex; align-items: center; gap:1.77rem;}
.badgeBody {display: flex; gap:1.47rem;}
.progress-track:hover {font-size:1.375rem; color:currentColor; text-align:left; width:auto; text-transform:lowercase}
.badgeBody a, body .tabsPrefix{color: var(--text); font-weight:600; letter-spacing:0.03em; text-transform:uppercase; font-size:0.89rem;}
.section-track > extra {margin-top:0; min-width:7px; width:1060px}

.blockIndicator {gap:0.97rem; align-items: center; display: flex;}
.badgeBody a:hover, .tabsPrefix:hover {color: var(--acc);}.toggleWrap{padding:0.51rem 1.09rem; font-size:0.79rem; transition:background 0.201s; letter-spacing:0.03em; border-radius: var(--rad-s); color:rgb(255, 255, 234); text-transform:uppercase; background: var(--acc); font-weight:700;}
.toggleWrap:hover {background: var(--acc-d); color:#f1f5fb;}

/* ---------- flow / shell ---------- */
.c-tag {padding-bottom:3.93rem;}

/* ---------- post ---------- */
.viewColumn {margin:1.63rem auto 0; orphans:2; border-radius: var(--rad); max-width: var(--read); border: 1px solid var(--edge); background: var(--card); box-shadow: var(--sh); font-synthesis:weight style small-caps; overflow: hidden;}.postSeparator{padding:2.48rem 2.66rem 1.24rem; text-rendering:auto;}
.u-badge {font-size: clamp(1.7rem, 1.2rem + 2.3vw, 2.5rem); margin-bottom:0.79rem;}

.heroTitle {font-size:0.75rem; display: flex; gap:0.47rem 1.19rem; color: var(--dim); align-items: center; flex-wrap: wrap;}.ui-review{gap:0.47rem; display: inline-flex; align-items: center;}
.ui-review svg {opacity:0.62; flex-shrink: 0;}
.statusText {font-style:italic;}

/* toc */
.badgeZone {padding:0 2.68rem;}.clear-12{border-radius: var(--rad-s); padding:1.09rem 1.23rem; background: var(--bg-2); border: 1px solid var(--edge);}.pageBlock:not(.dummy94){align-items: center; display: flex; justify-content: space-between;}html .blockName{display: inline-flex; border:0; color: var(--dim); background:none; padding:0.19rem; transition:transform 0.243s, color 0.202s;}
.statusPlaceholder {font-size:0.98rem; margin:0;}
.blockName:hover {color: var(--acc);}html .clear-12.is-shut .blockName{transform: rotate(-90deg);}
.clear-12.is-shut .postColumn {display: none;}
.postColumn {margin-top:0.74rem; padding-top:0.63rem; border-top: 1px solid var(--edge); line-height:1.9; font-size:0.94rem;}html .postColumn a{display: block; color: var(--text);}
@media (max-width: 576px) {
  .menu-indicator .slider-label {transition:transform 0.25s ease-in-out; box-shadow:0 13px 13px rgba(0,0,0,0.95); text-decoration:underline}
  .progress-track:hover {justify-content:flex-start; position:static; padding-top:43px; display:grid; height:auto; background-color:transparent}
}


.postColumn a:hover {color: var(--acc); font-variant-ligatures:normal;}

/* rich content */
.carouselButton {padding:1.43rem 2.59rem 0.24rem;}
.postColumn .panelSummary {font-size:0.78rem; padding-left:1.11rem;}
.sort-addon:hover {margin:26px 21px; border-radius:50%}

.el-review {font-variant-caps:normal; color: var(--text); font-size:1.05rem; line-height:1.8;}
.el-review > * + * {margin-top:1.27rem;}
.el-review h2 {color: var(--ink); font-size:1.55rem; font-family: var(--display); border-top: 1px solid var(--edge-2); line-height:1.3; margin-top:2.26rem; mix-blend-mode:normal; scroll-margin-top:5rem; padding-top:1.28rem;}
.el-review h3 {font-size:1.25rem; margin-top:1.73rem; font-family: var(--display); color: var(--ink);}
.el-review h3 {scroll-margin-top:5rem;}
.el-review h4 {margin-top:1.28rem; font-size:1rem; color: var(--ink); font-family: var(--display);}
.el-review a {text-underline-offset:2px; text-decoration-thickness:1px; text-decoration:underline;}
.el-review strong, .el-review b {color: var(--ink); font-weight:700;}
.el-review ul, .el-review ol {margin-left:1.37rem;}
.el-review ul {-webkit-hyphens:manual;-ms-hyphens:manual;hyphens:manual; perspective:none; list-style: disc;}.el-review ol{list-style: decimal;}
.el-review li {padding-left:0.28rem; margin-top:0.36rem;}
.el-review img {margin:1.46rem 0; border-radius: var(--rad-s);}body .el-review blockquote{border-left: 3px solid var(--acc); color: var(--ink); font-style:italic; background: var(--tint); padding:0.89rem 1.19rem; border-radius: 0 var(--rad-s) var(--rad-s) 0;}
.el-review code {font-size:0.93em; border: 1px solid var(--edge); padding:0.11em 0.41em; font-family:ui-monospace, "SF Mono", "Courier New", monospace; border-radius:1px; background: var(--bg-2);}
.el-review pre {font-size:0.96rem; padding:1.11rem 1.36rem; border-radius: var(--rad-s); line-height:1.7; overflow-x: auto; color:#dde2e0; background: var(--night);}
.el-review pre code {background:none; color:inherit; border:0; padding:0;}html .el-review table{border-collapse:collapse; font-size:0.86rem; width:100%;}*.el-review th, .el-review td{border: 1px solid var(--edge); text-align: left; padding-top:0.58rem;padding-right:0.82rem;padding-bottom:0.58rem;padding-left:0.82rem;}.el-review th{color: var(--ink); font-weight:bold; background: var(--bg-2);}
.el-review hr {border:0; border-top: 1px solid var(--edge);}
.el-review hr {margin:2.04rem 0;}

/* share */
.toolbarData {padding:1.65rem 2.63rem 2.33rem;}.featureDot:not(.skip51){width:41px; color: var(--dim); transition:background 0.176s, color 0.224s, border-color 0.148s, transform 0.147s; height:41px; justify-content: center; background: var(--card); align-items: center; display: inline-flex; border: 1px solid var(--edge); border-radius:50%;}
.screenTime {gap:0.58rem; flex-wrap: wrap; display: flex;}
.counter-meta:first-child {border-radius:50%; position:sticky; font-size:inherit; flex-wrap:wrap; max-width:none; text-decoration:underline}

.featureDot:hover {border-color: var(--acc); will-change:auto; color:#ffffff; background: var(--acc); transform: translateY(-1px);}/* ---------- talk / reach (forms) ---------- */
:where(.paginationOverlay), *.c-form-tertiary{margin:2.2rem auto 0; box-shadow: var(--sh); border: 1px solid var(--edge); padding:2.01rem 2.63rem 2.11rem; border-radius: var(--rad); max-width: var(--read); background: var(--card);}
.hero-title-bottom {color: var(--dim); font-size:0.92rem; margin-top:-0.64rem; margin-bottom:1.18rem;}

/* ---------- more (related) ---------- */
.chipBody {max-width: var(--read); margin:2.17rem auto 0;}
.panelArea {transition:transform 0.232s, box-shadow 0.198s, border-color 0.187s; border-radius: var(--rad-s); display: block; background: var(--card); padding:1.05rem 1.14rem; box-shadow: var(--sh); border: 1px solid var(--edge);}
.layoutInner {grid-template-columns: repeat(3, 1fr); gap:1.05rem; display: grid;}
.panelArea:hover {border-color: var(--acc-l); transform: translateY(-2px); box-shadow: var(--sh-l); mix-blend-mode:normal;}.widget__backdrop{line-height:1.4; font-family: var(--display); font-weight:700; font-size:0.93rem; color: var(--ink);}

/* ---------- forms ---------- */
input[type="text"], input[type="email"], input[type="password"], textarea {transition:border-color 0.242s, box-shadow 0.17s, background 0.249s; width:100%; color: var(--ink); padding:0.75rem 0.94rem; font:inherit; border: 1px solid var(--edge); text-decoration-skip-ink:auto; border-radius: var(--rad-s); background: var(--bg-2);}
input::placeholder, textarea::placeholder {color: var(--dim);}
textarea {min-height:6.47rem; resize: vertical;}
input:focus, textarea:focus {box-shadow:0 0 0 0px rgba(5, 155, 126, 0.16); border-color: var(--acc); background: var(--card); outline:0;}

.c-table-input {gap:1.03rem; display: flex; flex-wrap: wrap;}
.ratingZone {min-width:0; flex: 1 1 calc(50% - 0.5rem);}.actionAddon{display: flex;}.drawerOverlay{widows:2; page-break-inside:auto; flex: 1 1 100%;}
.actionAddon input {border-right:none; min-width:0; border-radius: var(--rad-s) 0 0 var(--rad-s); flex: 1;}.actionAddon .dropdownAddon:not(.unused95){border-radius: 0 var(--rad-s) var(--rad-s) 0;}

/* ---------- buttons ---------- */
.dropdownAddon {border: 1px solid var(--edge); letter-spacing:0.03em; align-items: center; backface-visibility:visible; gap:0.52rem; font-weight:700; border-radius: var(--rad-s); color: var(--ink); justify-content: center; transition:background 0.24s, color 0.224s, border-color 0.206s; background: var(--card); display: inline-flex; text-transform:uppercase; min-height:2.81rem; font-size:0.84rem; padding:0.71rem 1.32rem;}.dropdownAddon:hover{background: var(--bg-2); color: var(--ink); border-color: var(--dim);}
.progressBackdrop {color:hsl(117, 99.2%, 97.2%);}
.layout-body:not(:last-child) {margin-bottom:0; line-height:1; text-align:center}

.progressBackdrop {background: var(--acc); border-color: var(--acc);}
.progressBackdrop:hover {break-inside:auto; border-color: var(--acc-d); transform-style:flat; color:#f6ffff; background: var(--acc-d);}html .accordionTrigger{padding:0.78rem 0.96rem; min-width:3.07rem;}
.blockAction {width:100%;}/* ---------- decks (newsletter + account) ---------- */
:where(.heroClose){max-width: var(--band); display: grid; grid-template-columns: 1fr 1fr; gap:1.2rem; margin:2.56rem auto 0;}
.app-dialog {padding:1.5rem 1.66rem; border-radius: var(--rad); border: 1px solid var(--edge); perspective:none; box-shadow: var(--sh); hyphens:manual; display: flex; flex-direction: column; background: var(--card);}body .galleryCount{font-size:0.91rem; margin-bottom:0.93rem; color: var(--dim);}
.carouselInfo {gap:0.58rem; margin-top:auto; display: flex;}
.carouselInfo {flex-direction: column;}.carouselInfo .dropdownAddon{width:100%;}

/* ---------- footer ---------- */
.slot-comment {background: var(--night); padding:2.55rem 0; margin-top:3.46rem; color: var(--on-night); contain:none;}
.replyWrapper {width:100%; gap:1.53rem; flex-wrap: wrap; margin-inline:auto; align-items: center; padding:0 1.17rem; display: flex; max-width: var(--max); justify-content: space-between;}
.footerValue img {width:auto; height:28px; filter:brightness(0) invert(1); opacity:0.84;}
.app-hero {font-size:0.77rem; color: var(--on-night);}
.app-hero {margin-top:0.7rem; contain:none;}.dialogLink{gap:1.23rem; display: flex;}.dialogLink a{color: var(--on-night); font-size:0.86rem;}

.heroPrefix {display: flex; gap:0.55rem;}
.comment-preview > wrap {justify-content:space-around; padding-right:2rem; border:1px solid #ad7a05; background:none; margin:38px}

.dialogLink a:hover {image-rendering:auto; color:#ffffff;}
.heroPrefix a {height:32px; align-items: center; justify-content: center; transition:background 0.259s, color 0.167s, transform 0.177s; color: var(--on-night); width:37px; display: inline-flex; border-radius: var(--rad-s); background:rgba(254, 255, 255, 0.06);}
.heroPrefix a:hover {background: var(--acc); color:hsl(300, 100%, 98.6%); transform: translateY(-1px);}/* ---------- back to top ---------- */
.ui-gallery-summary{height:45px; justify-content: center; z-index: 900; align-items: center; transition:background 0.246s, transform 0.148s; width:45px; bottom:1.52rem; color:#efffff; border:none; border-radius:50%; background: var(--acc); box-shadow: var(--sh-l); position: fixed; right:1.65rem; display: none;}
.ui-gallery-summary:hover {transform: translateY(-2px); background: var(--acc-d);}
.ui-gallery-summary.modal-secondary {display: inline-flex;}

/* ---------- cookie ---------- */
.widgetSpacer {background: var(--card); bottom:0; padding:0.93rem 0; box-shadow:0 -3px 21px rgba(26, 20, 44, 0.04); left:0; right:0rem; z-index: 1100; border-top: 1px solid var(--edge); position: fixed;}
.skeletonOverlay {justify-content: space-between;}
.skeletonOverlay {padding:0 1.33rem; gap:1.44rem; align-items: center; margin-inline:auto; width:100%; display: flex; max-width: var(--max);}html .widgetSpacer p{page-break-inside:auto; margin:0; font-size:0.83rem; color: var(--text); contain:none;}html .widgetSpacer .dropdownAddon{min-height:2.39rem; padding:0.51rem 1.4rem; flex-shrink: 0;}/* ---------- auth layers (CSS :target modal) ---------- */
.actionItem{z-index: 1300; inset:0; display: none; position: fixed;}body .actionItem:target{display: grid; padding:1.18rem;}
.tag-title > info {transition:color 0.25s; padding-bottom:2.5rem; font-size:40px; justify-content:space-around; margin:auto; gap:45px}

.dividerInner {background:rgba(38, 26, 46, 0.52); position: absolute; inset:0; backdrop-filter:blur(2px);}body .actionItem:target{place-items: center;}
.snackbarBackdrop {width: min(94vw, 25rem); position: relative; box-shadow: var(--sh-l); padding:1.74rem 1.79rem 1.64rem; border-radius: var(--rad); animation:pop 0.228s ease-out; background: var(--card); z-index: 1; border: 1px solid var(--edge);}
.menu-indicator .slider-label {transition:opacity 0.25s; width:fit-content; flex-wrap:nowrap; min-width:7px; position:static; align-items:flex-start}

@keyframes pop {from{opacity:0; transform: translateY(8px) scale(0.99);} to {opacity:1; transform: none;} }
.progressOverlay {top:0.65rem; line-height:1; position: absolute; font-size:1.54rem; color: var(--dim); right:0.89rem; text-decoration:none;}
.box-time {display:block; cursor:default}
html .progressOverlay:hover{color: var(--ink);}
.actionItem .sortColumn {flex-direction: column; gap:0.98rem; display: flex;}.spinnerLink{color: var(--dim); font-size:0.88rem; margin-top:0.12rem; text-align: center;}.t-filter-section{border-bottom: 1px solid var(--edge); right:0; left:0; gap:0; box-shadow: var(--sh); display: none; flex-direction: column; align-items: stretch; background: var(--card); top:100%; position: absolute; padding:0.54rem 0;}

/* ---------- responsive ---------- */
@media (max-width: 860px) {
  .block__separator--odd {display: flex;}
.module-overlay::before {content:''; gap:34px; font-weight:normal; color:#a02036; height:auto}

  .t-filter-section.open {display: flex;}
  .badgeBody {padding:0 1.22rem; gap:0; flex-direction: column;}body .blockIndicator{gap:0.84rem; padding:0.86rem 1.26rem 0.35rem;}
  .badgeBody a {border-bottom: 1px solid var(--edge-2); padding:0.81rem 0;}

  .layoutInner {grid-template-columns: 1fr 1fr; widows:2;}
  .heroClose {grid-template-columns: 1fr;}
  .postSeparator {padding:1.85rem 1.32rem 1.04rem;}
}

@media (max-width: 680px) {
  html {font-size:100%;}
  .badgeZone {padding:0 1.35rem;}
  .carouselButton {padding:1.22rem 1.46rem 0.35rem;}html .paginationOverlay, *.c-form-tertiary{padding:1.56rem 1.32rem 1.8rem;}
  .toolbarData {padding:1.23rem 1.36rem 1.87rem;}
  .layoutInner {grid-template-columns: 1fr;}
  .replyWrapper {align-items: flex-start; flex-direction: column; gap:1.21rem;}
  .skeletonOverlay {flex-direction: column; gap:0.84rem; text-align: center;}
}

@media (max-width: 460px) {.ratingZone{flex: 1 1 100%;}
  .ui-gallery-summary {bottom:1rem; right:1.02rem;}*{animation:none !important; transition:none !important;}
}

@media (prefers-reduced-motion: reduce) {
  html {scroll-behavior: auto;}
}

@media print {
  .actionCap, .toolbarData, .paginationOverlay, .chipBody, .c-form-tertiary,
  .heroClose, .slot-comment, .ui-gallery-summary, .widgetSpacer, .actionItem, .cardExtra {display: none !important;}
  body {font-variant-ligatures:normal; background-color:#fff3ff;}
  .viewColumn {box-shadow:none;}
  .viewColumn {break-inside:auto; max-width:none; border:0 none; print-color-adjust:economy;}
}