/* SportTech Deals: Swim • Bike • Run, accessible static theme for interactive tools */
:root{--tri-navy:#091f34;--tri-sea:#087fb5;--tri-mint:#087d72;--tri-run:#d76c24;--tri-bg:#f3f7fa;--tri-line:#d9e4ec;--tri-ink:#102d40}
body.triathlon-page{background:var(--tri-bg);color:var(--tri-ink)}
.triathlon-page .top{background:var(--tri-navy)}
.triathlon-page .brand span{color:#a9f7e8}
.triathlon-page a:focus-visible,.triathlon-page button:focus-visible,.triathlon-page input:focus-visible,.triathlon-page textarea:focus-visible{outline:3px solid #26bddd;outline-offset:3px}
.tri-hero{background:radial-gradient(ellipse at 80% 5%,#155677 0,transparent 45%),linear-gradient(128deg,#071e32 5%,#123e55 65%,#0d304c);color:#fff;overflow:hidden;position:relative}
.tri-hero:after{content:"";position:absolute;inset:0;pointer-events:none;background:repeating-linear-gradient(125deg,transparent,transparent 54px,#ffffff08 55px,#ffffff08 56px);opacity:.7}
.tri-hero>.wrap{position:relative;z-index:1;padding-top:68px;padding-bottom:74px}
.tri-hero .eyebrow{color:#8be9db;font-weight:850}
.tri-hero h1{font-size:clamp(44px,6vw,75px);letter-spacing:-.073em;max-width:820px;margin:13px 0 17px;line-height:1.05}
.tri-hero h1 em{font-style:normal;color:#81e5db}
.tri-hero p{color:#c8dde5;font-size:17px;max-width:710px;line-height:1.65}
.tri-sport-ribbon{display:flex;flex-wrap:wrap;gap:10px;margin-top:27px}
.tri-sport-ribbon .ribbon-part{display:inline-flex;align-items:center;gap:9px;border:1px solid #ffffff36;color:#fff;border-radius:100px;padding:10px 16px;background:#ffffff0c;font-size:13px;font-weight:850}
.ribbon-part[data-sport="swim"]{border-left:5px solid #32b4eb}
.ribbon-part[data-sport="bike"]{border-left:5px solid #31c8ad}
.ribbon-part[data-sport="run"]{border-left:5px solid #ffac67}
.tri-main{max-width:1120px;padding:30px 0 90px}
.tri-panel{background:#fff;border:1px solid var(--tri-line);border-radius:24px;padding:28px;margin-bottom:21px;box-shadow:0 10px 30px #0d344610}
.tri-panel h2{font-size:clamp(24px,3vw,31px);margin:0 0 8px;letter-spacing:-.055em}
.tri-panel .intro{font-size:14px;margin:0 0 20px;max-width:750px}
.tri-eyebrow{color:#287b89;letter-spacing:.1em;text-transform:uppercase;font-size:11px;font-weight:950;margin-bottom:5px}
.distance-selector{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin-top:22px}
.distance-selector button{cursor:pointer;background:#f3f7f9;border:1px solid #cfdde5;border-radius:14px;padding:14px 8px;min-width:0;text-align:center;color:#234256;font:inherit;transition:background .15s,border-color .15s,transform .15s}
.distance-selector button:hover{border-color:#187fa2;transform:translateY(-1px)}
.distance-selector button[aria-pressed="true"]{background:#10374d;color:white;border-color:#10374d;box-shadow:inset 0 -4px 0 #39cfcb}
.distance-selector .distance-title{display:block;font-size:14px;font-weight:900;line-height:1.3}
.distance-selector .distance-detail{display:block;font-size:11px;line-height:1.4;margin-top:5px;opacity:.8}
.tri-custom-grid,.tri-inputs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
.tri-custom-grid{margin-top:20px;background:#eaf4f6;padding:17px;border-radius:15px;border:1px dashed #8fbfc6}
.tri-custom-grid[hidden]{display:none!important}
.tri-field{display:flex;flex-direction:column;gap:6px;font-size:13px;font-weight:850;color:#183949;min-width:0}
.tri-field input,.tri-field textarea{width:100%;min-width:0;background:#f8fbfc;color:#173747;border:1px solid #c5d9df;border-radius:11px;padding:12px 13px;font:inherit;font-size:17px;font-weight:760}
.tri-field textarea{min-height:98px;font-weight:500;resize:vertical;font-size:15px;line-height:1.45}
.tri-field small{color:#647e89;font-size:12px;font-weight:500}
.tri-field.swim{border-left:4px solid var(--tri-sea);padding-left:12px}
.tri-field.bike{border-left:4px solid var(--tri-mint);padding-left:12px}
.tri-field.run{border-left:4px solid var(--tri-run);padding-left:12px}
.tri-form-block{margin-top:23px}
.tri-form-block h3{font-size:18px;margin:0 0 17px;font-weight:900}
.tri-section-label{color:#627b87;font-size:12px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.tri-split-visual{display:flex;gap:0;width:100%;overflow:hidden;border-radius:18px;margin-top:16px}
.tri-split-visual>div{padding:16px 11px;min-width:0;flex:1}
.tri-split-visual .swim{background:#e1f2fa;border-top:5px solid var(--tri-sea)}
.tri-split-visual .bike{background:#e1f5ef;border-top:5px solid var(--tri-mint)}
.tri-split-visual .run{background:#fff0e6;border-top:5px solid var(--tri-run)}
.tri-split-visual .tri-piece-label{font-size:12px;font-weight:850;display:block}
.tri-split-visual strong{font-size:18px;letter-spacing:-.03em;display:block;margin-top:4px}
.tri-results{background:linear-gradient(130deg,#0a2a43,#113a56);color:#fff;border-radius:23px;padding:28px;margin:24px 0 8px}
.tri-results .tri-eyebrow{color:#a5ebee}
.tri-results .time{font-size:clamp(44px,7vw,73px);line-height:1.05;font-weight:950;letter-spacing:-.07em;margin:8px 0}
.tri-results p{color:#d0e6ed;font-size:14px;margin:7px 0}
.tri-results .status{font-weight:900;color:#b1f1c5}
.tri-results .status.neutral{color:#d1e1eb}
.tri-result-segments{display:flex;overflow:hidden;height:14px;border-radius:90px;background:#ffffff2a;margin:20px 0 15px}
.tri-result-segments>span{height:100%;width:0;min-width:0;transition:width .2s}
.tri-result-segments .swim{background:#3aafe4}
.tri-result-segments .t1,.tri-result-segments .t2{background:#bbc8d1}
.tri-result-segments .bike{background:#2bd0a9}
.tri-result-segments .run{background:#ffa66a}
.tri-result-metrics{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.tri-result-metrics div{background:#ffffff12;border:1px solid #ffffff18;border-radius:12px;padding:12px 9px}
.tri-result-metrics small{font-size:11px;opacity:.82;display:block}
.tri-result-metrics strong{font-size:15px;display:block;margin-top:4px;white-space:nowrap}
.tri-result-metrics .swim{border-bottom:3px solid #3aafe4}
.tri-result-metrics .bike{border-bottom:3px solid #2bd0a9}
.tri-result-metrics .run{border-bottom:3px solid #ffa66a}
.tri-table-wrap{overflow-x:auto;margin-top:14px;border:1px solid var(--tri-line);border-radius:14px}
.tri-table{border-collapse:collapse;width:100%;min-width:630px;margin:0;font-size:13px}
.tri-table th,.tri-table td{padding:11px 13px;text-align:left;border-bottom:1px solid #e4ecf0}
.tri-table th{background:#eaf1f5;color:#385365;font-size:11px;letter-spacing:.045em;text-transform:uppercase}
.tri-table tr:last-child td{border-bottom:0}
.tri-table td:last-child{font-weight:850;color:#0f3e50;white-space:nowrap}
.tri-table tr[data-sport="swim"] td:first-child{border-left:4px solid #32b4eb}
.tri-table tr[data-sport="bike"] td:first-child{border-left:4px solid #31c8ad}
.tri-table tr[data-sport="run"] td:first-child{border-left:4px solid #e99244}
.tri-table tr[data-sport="transition"] td:first-child{border-left:4px solid #a5b8c3}
.tri-table tr[data-sport="finish"] td:first-child{border-left:4px solid #071e32;font-weight:900}
.tri-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin:18px 0}
.tri-check-group{padding:17px;border:1px solid var(--tri-line);border-radius:15px;background:#fbfdfe}
.tri-check-group h3{font-size:18px;margin:0 0 12px;display:flex;align-items:center;gap:8px}
.tri-check-group[data-sport="swim"]{border-top:4px solid var(--tri-sea)}
.tri-check-group[data-sport="bike"]{border-top:4px solid var(--tri-mint)}
.tri-check-group[data-sport="run"]{border-top:4px solid var(--tri-run)}
.tri-check-group[data-sport="transition"]{border-top:4px solid #849dab}
.tri-check-group[data-sport="general"]{border-top:4px solid #375368}
.tri-check-group ul{list-style:none;padding:0;margin:0}
.tri-check-group li{padding:9px 0;border-top:1px solid #e7eff2}
.tri-check-group label{display:flex;align-items:flex-start;gap:10px;font-size:13px;line-height:1.5;cursor:pointer;color:#385566}
.tri-check-group input{accent-color:#0f8277;width:18px;height:18px;flex-shrink:0}
.tri-check-group input:checked+span{text-decoration:line-through;color:#758b95}
.tri-actions{display:flex;gap:10px;flex-wrap:wrap;margin:22px 0 12px}
.tri-btn{display:inline-flex;gap:10px;align-items:center;justify-content:center;border:0;border-radius:12px;padding:13px 19px;font:inherit;font-size:14px;font-weight:900;cursor:pointer;text-decoration:none;background:#c2fa9a;color:#163d2b}
.tri-btn.secondary{background:#e8f0f4;color:#1b4457}
.tri-btn.dark{background:var(--tri-navy);color:#fff}
.tri-btn:disabled{opacity:.5;cursor:not-allowed}
.tri-note{font-size:13px;color:#627b88;line-height:1.6}
.tri-error{color:#a82b2b;font-weight:750;font-size:13px;min-height:18px}
.tri-kicker{display:inline-block;border-radius:100px;padding:6px 13px;background:#d8f7f2;color:#17564e;text-transform:uppercase;font-size:11px;letter-spacing:.08em;font-weight:900}
.triathon-page .tri-results p{color:#d0e6ed}
@media(max-width:850px){.distance-selector{grid-template-columns:repeat(3,minmax(0,1fr))}.tri-result-metrics{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.tri-hero>.wrap{padding-top:45px;padding-bottom:51px}.tri-hero p{font-size:15px}.tri-main{padding-top:18px}.tri-panel{padding:17px;border-radius:18px}.distance-selector{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}.distance-selector button{padding:12px 7px}.tri-custom-grid,.tri-inputs,.tri-check-grid{grid-template-columns:1fr}.tri-results{padding:18px}.tri-split-visual>div{padding:12px 7px}.tri-split-visual strong{font-size:14px}.tri-result-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.tri-actions .tri-btn{width:100%}.tri-sport-ribbon .ribbon-part{font-size:12px;padding:8px 11px}}
[hidden]{display:none!important}
@media print{.triathlon-page{background:#fff;color:#111}.triathlon-page header,.triathlon-page footer,.no-print{display:none!important}.tri-main{width:100%;max-width:none;padding:0}.tri-panel{box-shadow:none;border:0;padding:7px 0;margin:0;border-radius:0;break-inside:avoid}.tri-panel h2{font-size:22px;margin:5px 0}.tri-results{background:#fff!important;color:#111!important;border:1px solid #444;padding:12px;margin:5px 0}.tri-results *{color:#111!important}.tri-results .time{font-size:36px}.tri-result-segments{border:1px solid #ddd}.tri-result-metrics div{border:1px solid #ddd}.tri-table{min-width:0}.tri-table th,.tri-table td{font-size:10px;padding:5px}.tri-check-grid{grid-template-columns:1fr 1fr;gap:8px}.tri-check-group{padding:8px;break-inside:avoid}.tri-check-group li{padding:3px 0}.tri-check-group label{font-size:10px}.tri-sport-ribbon,.tri-hero,.tri-inputs,.tri-custom-grid,.distance-selector{display:none!important}.print-only{display:block!important}}

/* Pace goal & scenario insight cards */
.tri-insight-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:13px;margin:18px 0}
.tri-insight{background:#f7fafc;border:1px solid #d9e5eb;border-top:4px solid #93aab8;border-radius:16px;padding:19px 16px;min-width:0;display:flex;flex-direction:column;align-items:flex-start}
.tri-insight.swim{border-top-color:var(--tri-sea);background:#eff9ff}
.tri-insight.bike{border-top-color:var(--tri-mint);background:#ebf9f4}
.tri-insight.run{border-top-color:var(--tri-run);background:#fff4e9}
.tri-insight.slower{border-top-color:#8fabbc}
.tri-insight.baseline{border-top-color:#1c526b;background:#eaf4f8}
.tri-insight.faster{border-top-color:#1eb89d;background:#eafbf6}
.tri-insight>span{font-weight:900;font-size:13px;letter-spacing:.025em;color:#385468}
.tri-insight>strong{font-size:clamp(22px,2.6vw,33px);line-height:1.13;letter-spacing:-.045em;margin:11px 0 7px;overflow-wrap:anywhere;color:#123b50}
.tri-insight>p{color:#58717e;font-size:12px;line-height:1.55;margin:0 0 12px}
.tri-insight>.tri-btn{margin-top:auto;padding:10px 12px;font-size:12px}
.tri-insights[hidden]{display:none!important}
@media(max-width:730px){.tri-insight-grid{grid-template-columns:1fr}.tri-insight{padding:16px}.tri-insight>strong{font-size:27px}}
@media print{.tri-insights{break-inside:avoid}.tri-insight-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.tri-insight{padding:8px}.tri-insight>strong{font-size:19px}.tri-insight .tri-btn{display:none}.tri-insight>p{font-size:10px}}

/* Keep the Swim Bike Run navigation usable on narrow phones. */
@media(max-width:620px){
  .triathlon-page .nav{height:auto;min-height:70px;flex-wrap:wrap;padding:15px 0;gap:11px}
  .triathlon-page .brand{font-size:20px}
  .triathlon-page .nav nav{display:flex;flex-wrap:wrap;align-items:center;gap:12px}
  .triathlon-page .nav nav a{font-size:12px}
  .tri-hero h1{overflow-wrap:break-word}
  .tri-insight-grid{grid-template-columns:minmax(0,1fr)}
}
