*, *::before, *::after{margin:0; padding:0; box-sizing: border-box;}/* ============================================================
   1017_new_v1 — stylesheet
   ============================================================ */

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

html {scroll-behavior: smooth; -webkit-text-size-adjust:100%; font-size:113.9%;}img, svg{display: block; max-width:100%;}ul, ol{list-style: none;}
a {text-decoration:none; image-rendering:auto; color: var(--acc); text-underline-offset:auto;}
a:hover {color: var(--acc-d);}
button {cursor: pointer; font-family:inherit;}h1{font-weight:700; font-family: var(--display);}h1{color: var(--ink); letter-spacing:-0.015em; line-height:1.18;}*.shadow-6{overflow: hidden; white-space: nowrap; margin:-1px; clip:rect(0, 0, 0, 0); padding:0px; height:1px; width:1px; position: absolute; border:0 none;}

:focus-visible {outline: 2px solid var(--acc); border-top-left-radius:4px;border-top-right-radius:4px;border-bottom-right-radius:4px;border-bottom-left-radius:4px; outline-offset:2px;}/* span headings (no h2/h3 anywhere but article content) */
.u-box, .banner__track:not(.none46), html .p-start, body .ml-sm, html .float-24{letter-spacing:-0.01em; display: block; font-family: var(--display); color: var(--ink); font-weight:700;}
.u-box {font-size:1.28rem; margin-bottom:1.05rem; mix-blend-mode:normal;}
.p-start {margin-bottom:1.23rem; font-size:1.24rem;}.banner__track{font-size:1.11rem; margin-bottom:0.24rem;}/* ---------- topbar ---------- */
.gap-between:not(.noop29){transform-style:flat; z-index: 1000; break-inside:auto; position: sticky; border-bottom: 1px solid var(--edge); background:rgba(255, 255, 239, 0.87); top:0; backdrop-filter:saturate(150%) blur(8px);}

/* ---------- scroll progress ---------- */
.el-nav-count {left:0rem; height:3px; width:0px; position: fixed; z-index: 1200; transition:width 0.086s linear; background: var(--acc); top:0;}
.col-12 {gap:1.01rem; align-items: center; width:100%; padding:0 1.32rem; min-height:3.92rem; justify-content: space-between; margin-inline:auto; max-width: var(--max); display: flex;}
.text-16 {display: inline-flex; align-items: center;}
.text-16 img {height:25px; width:auto;}

.rating__area {border:none; flex-direction: column; background:none;}

.rating__area {display: none; gap:8px; padding:0.43rem;}

.pr-1 {display: flex; gap:1.85rem; align-items: center;}
.rating__area span {width:20px; border-radius:2px; height:2px; background: var(--ink); display: block;}
.c-tag-area {display: flex; gap:1.47rem;}
.c-tag-area a, .sortSeparator {text-transform:uppercase; font-size:0.79rem; letter-spacing:0.03em; font-weight:600; color: var(--text);}
.comment-item:first-child {align-items:center; position:absolute; transition:color 0.15s}
.drawerAction{display: flex; align-items: center; gap:0.97rem;}
.c-tag-area a:hover, .sortSeparator:hover {color: var(--acc);}
.drawer-track:first-child {transition:color 0.25s; flex:0 0 auto; width:fit-content; justify-content:flex-end; line-height:normal}

.font-none {font-size:0.78rem; text-transform:uppercase; color:#ffffff; letter-spacing:0.03em; background: var(--acc); padding:0.47rem 1.12rem; transition:background 0.164s; border-radius: var(--rad-s); font-weight:700;}
.font-none:hover {background: var(--acc-d); color:rgb(226, 255, 238);}

/* ---------- flow / shell ---------- */
.step-full {padding-bottom:3.94rem;}
.media-input.entry-bottom {text-align:justify; margin:13px; transition:transform 0.15s ease-in-out}
body .l-search{padding:2.37rem 2.54rem 1.31rem;}
.slider-item:first-child {width:100%; font-weight:600; overflow:hidden; transition:opacity 0.4s; position:sticky}


/* ---------- post ---------- */
.my-half {overflow: hidden; margin:1.68rem auto 0; border: 1px solid var(--edge); box-shadow: var(--sh); max-width: var(--read); background: var(--card); border-radius: var(--rad);}
.reply-icon + .comment-overlay {justify-content:center; color:currentColor}

.mt-5 {margin-bottom:0.89rem; font-size: clamp(1.7rem, 1.2rem + 2.3vw, 2.5rem);}

.leading-5 {shape-margin:0; gap:0.45rem 1.32rem; flex-wrap: wrap; color: var(--dim); display: flex; align-items: center; font-size:0.89rem;}
.tracking-4 {align-items: center; gap:0.39rem; display: inline-flex;}
.tracking-4 svg {flex-shrink: 0; opacity:0.76;}
.d-between {-webkit-hyphens:manual;-ms-hyphens:manual;widows:2; hyphens:manual; font-style:italic;}

/* toc */
.mx-0 {padding:0 2.53rem;}
.pl-between {border-radius: var(--rad-s); background: var(--bg-2); border: 1px solid var(--edge); padding:0.98rem 1.2rem;}
.position-4 {justify-content: space-between; word-spacing:normal; align-items: center; display: flex;}
.mx-20 {display: inline-flex; padding:0.24rem; color: var(--dim); background:none; transition:transform 0.261s, color 0.231s; border:0;}
.ml-sm {margin:0; font-size:1rem;}*.mx-20:hover{color: var(--acc);}.pl-between.is-shut :where(.mx-20){transform: rotate(-90deg);}
.tag-addon {transition:all 0.35s ease; display:inline-flex; padding-left:0.25rem; margin-top:0; justify-content:space-around; background-color:#9c46bb}

.pl-between.is-shut .pb-0 {display: none;}
.pb-0 {margin-top:0.76rem; font-size:0.96rem; line-height:1.9; border-top: 1px solid var(--edge); padding-top:0.69rem;}
.pb-0 a {color: var(--text); display: block;}.pb-0 a:hover{text-rendering:auto; color: var(--acc); perspective:none;}
.pb-0 .align-2 {font-size:0.91rem; padding-left:1.18rem;}

/* rich content */
.mr-screen {padding:1.46rem 2.62rem 0.33rem;}
.l-select {font-size:1.02rem;}
.l-select {line-height:1.8; color: var(--text);}
.l-select > * + * {margin-top:1.27rem;}
.l-select h2 {margin-top:2.31rem; color: var(--ink); font-size:1.56rem; scroll-margin-top:5rem; contain:none; shape-margin:0; font-family: var(--display); line-height:1.3; padding-top:1.35rem; border-top: 1px solid var(--edge-2);}.l-select h3{scroll-margin-top:5rem; font-size:1.23rem; color: var(--ink); font-family: var(--display); margin-top:1.77rem;}
.l-select h4 {font-size:1.11rem; color: var(--ink); font-family: var(--display); margin-top:1.25rem;}html .l-select a{text-underline-offset:2px; text-decoration-thickness:1px; text-decoration:underline;}
.l-select strong, .l-select b {font-synthesis:weight style small-caps; font-weight:bold; transform-style:flat; color: var(--ink);}html .l-select ul, body .l-select ol{margin-left:1.27rem;}
.l-select ul {list-style: disc;}.l-select ol{list-style: decimal;}
.l-select li {padding-left:0.33rem; margin-top:0.4rem;}body .l-select img{border-radius: var(--rad-s); margin:1.53rem 0;}
@media (min-width: 1280px) and (max-width: 1667px) {
  .badge-input + .skeleton-content {flex:0 0 auto; cursor:default; margin-top:0; margin-bottom:4px; flex-wrap:wrap}
  .module-value .block-spacer {position:static; padding-left:1.75rem; width:auto; transition:opacity 0.35s}
  .filter-icon:first-child {position:relative; flex-wrap:wrap; align-items:flex-end}
  .box-button:hover {padding-bottom:12px; transition:transform 0.4s ease-in-out; color:#aaaaaa}
}

body .l-select blockquote{background: var(--tint); color: var(--ink); font-style:italic; border-radius: 0 var(--rad-s) var(--rad-s) 0; border-left: 3px solid var(--acc); padding:0.84rem 1.33rem;}
.l-select code {border: 1px solid var(--edge); font-family:ui-monospace, "SF Mono", "Courier New", monospace; background: var(--bg-2); border-top-left-radius:8px;border-top-right-radius:8px;border-bottom-right-radius:8px;border-bottom-left-radius:8px; padding:0.02em 0.53em; font-size:0.84em;}
.l-select pre {color:#ecf5ff; padding-top:1.1rem;padding-right:1.23rem;padding-bottom:1.1rem;padding-left:1.23rem; overflow-x: auto; font-size:0.87rem; line-height:1.7; background: var(--night); word-spacing:normal; border-radius: var(--rad-s);}html .l-select pre code{color:inherit; padding:0em; background:none; border:0 none;}
.l-select table {border-collapse:collapse;}
.l-select table {width:100%; font-size:0.98rem;}
.l-select th, .l-select td {font-variant-caps:normal; border: 1px solid var(--edge); text-align: left; font-synthesis:weight style small-caps;}
.l-select th, .l-select td {padding-top:0.67rem; padding-right:0.76rem; padding-bottom:0.67rem; padding-left:0.76rem;}
.l-select th {text-decoration-skip-ink:auto; background: var(--bg-2); font-weight:bold; color: var(--ink);}
.post-line .card-text {box-shadow:none; background-color:transparent}

.l-select hr {margin:2.03rem 0; border:0 none; border-top: 1px solid var(--edge);}

/* share */
.tracking-xl {padding:1.75rem 2.68rem 2.36rem;}
.overflow-0 {justify-content: center; color: var(--dim); align-items: center; border: 1px solid var(--edge); display: inline-flex; transition:background 0.245s, color 0.234s, border-color 0.152s, transform 0.115s; width:40px; height:35px; border-radius:50%; background: var(--card);}html .py-1{gap:0.52rem; display: flex; flex-wrap: wrap;}
.overflow-0:hover {color:#fffff5; transform: translateY(-1px); border-color: var(--acc); background: var(--acc);}
.modal {font-size:0.97rem; margin-bottom:1.24rem; color: var(--dim); margin-top:-0.56rem;}

/* ---------- talk / reach (forms) ---------- */
.justify-2xl, .mb-1 {border-radius: var(--rad); padding:1.95rem 2.57rem 2.18rem; box-shadow: var(--sh); margin:2.17rem auto 0; background: var(--card); max-width: var(--read); border: 1px solid var(--edge);}

/* ---------- more (related) ---------- */
.bg-full {max-width: var(--read); margin:2.17rem auto 0;}
.position-8 {grid-template-columns: repeat(3, 1fr); gap:0.93rem; display: grid;}
.bg-half {border-radius: var(--rad-s); border: 1px solid var(--edge); padding-top:1.08rem; padding-right:1.2rem;}
.bg-half {padding-bottom:1.08rem; padding-left:1.2rem; box-shadow: var(--sh); display: block; background: var(--card); transition:transform 0.226s, box-shadow 0.138s, border-color 0.205s;}
.bg-half:hover {transform: translateY(-2px); border-color: var(--acc-l); box-shadow: var(--sh-l);}
.justify-end {line-height:1.4; font-size:0.96rem; font-weight:700; color: var(--ink); font-family: var(--display);}
input::placeholder, textarea::placeholder {color: var(--dim);}

/* ---------- forms ---------- */
input[type="text"], input[type="email"], input[type="password"], textarea {color: var(--ink); border-radius: var(--rad-s); border: 1px solid var(--edge); font-variant-ligatures:normal; width:100%; background: var(--bg-2); padding-top:0.7rem;padding-right:0.89rem;padding-bottom:0.7rem;padding-left:0.89rem; image-rendering:auto; font:inherit; transition:border-color 0.14s, box-shadow 0.224s, background 0.158s;}
input:focus, textarea:focus {text-underline-offset:auto; outline:0; border-color: var(--acc); box-shadow:0 0 0 -1px rgba(0, 132, 144, 0.22); background: var(--card); image-rendering:auto;}
textarea {resize: vertical; min-height:6.57rem;}

.el-module-image {flex-wrap: wrap;}

.el-module-image {gap:0.96rem; display: flex;}
.toolbar__summary {display:flex; max-width:none; opacity:1; align-items:stretch; transition:opacity 0.25s; margin-bottom:4px}

.step-backdrop:hover {flex:1; padding-right:21px; margin-bottom:0}

.w-2 {will-change:auto; flex: 1 1 100%;}
.gap-2 {min-width:0; flex: 1 1 calc(50% - 0.5rem);}html .menu__separator--bottom{display: flex;}
.menu__separator--bottom input {flex: 1; border-radius: var(--rad-s) 0 0 var(--rad-s); min-width:0; border-right:none;}
.menu__separator--bottom .pl-start {border-radius: 0 var(--rad-s) var(--rad-s) 0;}

/* ---------- buttons ---------- */
.pl-start {border: 1px solid var(--edge); font-size:0.89rem; transition:background 0.142s, color 0.219s, border-color 0.2s; font-weight:bold; gap:0.47rem; display: inline-flex; min-height:2.8rem; background: var(--card); border-radius: var(--rad-s); text-transform:uppercase; align-items: center; color: var(--ink); padding-top:0.71rem;padding-right:1.26rem;padding-bottom:0.71rem;padding-left:1.26rem; justify-content: center; letter-spacing:0.03em;}
.pl-start:hover {color: var(--ink); word-spacing:normal; border-color: var(--dim); break-inside:auto; background: var(--bg-2);}
.align-6 {color:#fffff6; border-color: var(--acc); background: var(--acc);}*.align-6:hover{border-color: var(--acc-d); color:#eeffff; background: var(--acc-d);}
.ml-4 {width:100%;}
.grid-auto {min-width:2.93rem; padding-top:0.76rem;padding-right:1.05rem;padding-bottom:0.76rem;padding-left:1.05rem;}

/* ---------- decks (newsletter + account) ---------- */
.l-step {max-width: var(--band); margin:2.6rem auto 0; display: grid; gap:1.22rem; grid-template-columns: 1fr 1fr;}
.skeleton__foot--large {border-radius: var(--rad); padding-top:1.45rem;padding-right:1.64rem;padding-bottom:1.45rem;padding-left:1.64rem; border: 1px solid var(--edge); flex-direction: column; display: flex; box-shadow: var(--sh); background: var(--card);}
#layout-value {max-width:140px; height:12px; transition:all 0.2s ease; background:transparent; position:absolute; padding:33px}
html .expand-module{margin-bottom:0.92rem; font-size:0.82rem; color: var(--dim);}
.cardPrefix {display: flex; margin-top:auto; flex-direction: column; gap:0.61rem;}
.cardPrefix .pl-start {background-blend-mode:normal; width:100%; perspective:none;}

/* ---------- footer ---------- */
.z-5 {margin-top:3.36rem; color: var(--on-night); padding:2.6rem 0; background: var(--night);}.pr-screen img{opacity:0.91; width:auto; filter:brightness(0) invert(1); shape-margin:0; height:25px;}
.col-full {justify-content: space-between; width:100%; margin-inline:auto; padding:0 1.19rem; flex-wrap: wrap; max-width: var(--max); align-items: center; gap:1.51rem; display: flex;}
.tracking-0 {color: var(--on-night); margin-top:0.67rem; font-size:0.73rem;}
.my-8 {display: flex; gap:1.33rem;}
.my-8 a {perspective:none; color: var(--on-night); font-size:0.84rem;}

.border-block {display: flex; gap:0.56rem;}
.my-8 a:hover {color:#fbffff;}
.border-block a {background:rgba(255, 252, 254, 0.15); border-radius: var(--rad-s); color: var(--on-night); display: inline-flex; justify-content: center; height:36px; transition:background 0.164s, color 0.215s, transform 0.117s; mix-blend-mode:normal; width:39px; align-items: center; background-blend-mode:normal;}
.border-block a:hover {background: var(--acc); transform: translateY(-1px); color:#ffedee;}

/* ---------- back to top ---------- */
.opacity-1 {box-shadow: var(--sh-l); display: none; justify-content: center; z-index: 900; color:hsl(58, 100%, 97.6%); right:1.68rem; border-top-left-radius:50%; border-top-right-radius:50%; border-bottom-right-radius:50%; border-bottom-left-radius:50%; width:45px;}

/* ---------- back to top ---------- */
.opacity-1 {align-items: center; position: fixed; bottom:1.6rem; height:42px; background: var(--acc); transition:background 0.22s, transform 0.145s; border:0;}
.opacity-1:hover {background: var(--acc-d); transform: translateY(-2px); perspective:none; text-underline-offset:auto;}
.opacity-1.skeleton--expanded {display: inline-flex;}

/* ---------- cookie ---------- */
.position-half {position: fixed; right:0; bottom:0; left:0; box-shadow:0 -4px 20px rgba(14, 18, 44, 0.14); border-top: 1px solid var(--edge); background: var(--card); padding:0.83rem 0; z-index: 1100;}
.m-6 {padding:0 1.18rem; gap:1.55rem; display: flex; margin-inline:auto; justify-content: space-between;}
.m-6 {max-width: var(--max); width:100%; align-items: center;}
.position-half p {font-size:0.87rem; margin:0; color: var(--text);}.position-half .pl-start:not(.dummy74){tab-size:4; flex-shrink: 0; backface-visibility:visible; padding:0.53rem 1.44rem; min-height:2.4rem;}

/* ---------- auth layers (CSS :target modal) ---------- */
.area-slider {inset:0; position: fixed; display: none; z-index: 1300;}
.d-start {inset:0; background:rgba(4, 35, 21, 0.63); position: absolute; backdrop-filter:blur(2px);}
.area-slider:target {padding-top:1.31rem;padding-right:1.31rem;padding-bottom:1.31rem;padding-left:1.31rem; place-items: center; display: grid;}
.border-end {position: relative; animation:pop 0.233s ease-out; border-radius: var(--rad); z-index: 1; padding:1.82rem 1.79rem 1.62rem; width: min(94vw, 25rem); border: 1px solid var(--edge); box-shadow: var(--sh-l); background: var(--card);}
@keyframes pop { from {transform: translateY(8px) scale(0.99); opacity:0;} to {opacity:1; transform: none;} }
.zone-card {color: var(--dim); right:0.9rem; top:0.66rem; text-decoration:none; line-height:1; position: absolute; font-size:1.53rem;}
.zone-card:hover {color: var(--ink);}
.float-sm {font-size:0.93rem;}
.area-slider .clear-4 {gap:0.82rem; flex-direction: column; display: flex;}
.float-sm {text-align: center; margin-top:0.18rem; shape-margin:0; color: var(--dim);}
  .pr-1 {display: none; box-shadow: var(--sh); padding:0.53rem 0; left:0; align-items: stretch; position: absolute; flex-direction: column; top:100%; border-bottom: 1px solid var(--edge); background: var(--card); right:0; gap:0rem;}

/* ---------- responsive ---------- */
@media (max-width: 860px) {
  .rating__area {display: flex;}
.accordion-body + .divider-title {display:inline-block; padding-top:0.875rem; margin:0 auto; transition:transform 0.2s ease-in-out; margin-left:31px}

  .pr-1.open {display: flex; text-underline-offset:auto;}.c-tag-area:not(.null66){padding:0 1.33rem; flex-direction: column; gap:0;}
  .c-tag-area a {font-variant-ligatures:normal; padding:0.75rem 0; transform-style:flat; border-bottom: 1px solid var(--edge-2);}
  .drawerAction {gap:0.83rem; padding:0.9rem 1.31rem 0.37rem;}

  .position-8 {grid-template-columns: 1fr 1fr;}.l-step:not(.null67){grid-template-columns: 1fr;}
}

@media (max-width: 680px) {
  html {font-size:100%;}
  .l-search {padding:1.79rem 1.32rem 1.08rem;}
  .mr-screen {padding:1.32rem 1.48rem 0.25rem; tab-size:4;}
@media (min-width: 1280px) and (max-width: 1482px) {
  .toolbar__summary {position:absolute; display:grid; transition:opacity 0.35s; cursor:default}
  .slider-item:first-child {transition:all 0.15s ease; gap:35px; overflow:visible; color:currentColor}
  .drawer-track:first-child {position:static; justify-content:flex-start; padding-right:43px; text-decoration:underline}
}


  .mx-0 {padding:0 1.39rem;}
  .justify-2xl, .mb-1 {padding:1.63rem 1.42rem 1.82rem;}
  .tracking-xl {padding:1.29rem 1.36rem 1.88rem;}*.position-8{word-spacing:normal; grid-template-columns: 1fr;}
  .col-full {flex-direction: column; align-items: flex-start; gap:1.2rem;}
  .m-6 {flex-direction: column; text-align: center; gap:0.81rem;}
.action-subtitle::before {content:''; border-radius:0; height:14px}

}

@media (max-width: 460px) {.gap-2{flex: 1 1 100%;}
  .opacity-1 {right:0.97rem; bottom:0.92rem;}
}

@media (prefers-reduced-motion: reduce) {
  html {scroll-behavior: auto;}*{transition:none !important; animation:none !important;}
}

@media print {.gap-between:not(.nil16), body .tracking-xl, html .justify-2xl, *.bg-full, body .mb-1, .l-step, .z-5, .opacity-1, body .position-half, .area-slider:not(.skip37), .el-nav-count{display: none !important;}
  body {background:rgb(255, 250, 242);}
  .my-half {max-width:none; border:none; box-shadow:none;}
.hero-foot:first-child {min-width:42px; margin-top:0}

}
