/* Outest tools — look matches the trail guides (tour-du-mont-blanc.css), standalone copy. */
:root{--linen:#faf7f2;--paper:#fffdf9;--sage:#e6ebdf;--sage-deep:#c9d5c2;--ink:#0e1316;--forest:#173f30;--forest-mid:#376950;--ember:#ed8153;--ember-deep:#d9693e;--ember-soft:#fbe6db;--muted:#56625d;--line:#d8d8cf;--shadow:0 18px 50px rgba(42,57,47,.12);--max:1120px;--display:"Bricolage Grotesque","Arial Narrow",sans-serif;--body:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif}
*{box-sizing:border-box}
html{background:var(--linen);color:var(--ink);-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--body);font-size:17px;line-height:1.65;background:var(--linen);overflow-x:hidden}
a{color:var(--forest-mid);text-underline-offset:3px}
a:hover{color:var(--forest)}
img{max-width:100%;display:block}
.wrap{width:min(100% - 32px,var(--max));margin-inline:auto}
.nav{position:sticky;top:0;z-index:10;background:rgba(250,247,242,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line)}
.nav .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:64px}
.nav img{height:30px;width:auto}
.nav-links{display:flex;gap:18px;align-items:center;font-weight:700;font-size:15px}
.nav-links a{color:var(--ink);text-decoration:none}
.nav-links a.lang{font-size:14px;color:var(--muted);font-weight:700}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:12px 20px;border-radius:999px;font-weight:800;font-size:15px;text-decoration:none;border:0;cursor:pointer;line-height:1.2;font-family:inherit}
.btn-ember{background:var(--ember);color:#fff}
.btn-ember:hover{background:var(--ember-deep);color:#fff}
.btn-ghost{background:transparent;color:var(--forest);border:1.5px solid var(--forest)}
.btn-ghost:hover{background:var(--forest);color:#fff}
.btn-sm{padding:9px 16px;font-size:14px}
.nav-links .btn{color:#fff}
.crumbs{font-size:14px;color:var(--muted);padding:18px 0 0}
.crumbs a{color:var(--muted)}
.hero{padding:22px 0 18px}
.hero h1{font-family:var(--display);font-weight:800;font-size:clamp(32px,5.6vw,58px);line-height:1.03;letter-spacing:-.02em;margin:10px 0 14px;color:var(--forest)}
.hero .lead{font-size:clamp(17px,2.1vw,20px);color:var(--muted);max-width:780px;margin:0}
.eyebrow{font-weight:800;font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--ember-deep)}
section{padding:30px 0}
h2{font-family:var(--display);font-weight:800;font-size:clamp(26px,3.6vw,38px);line-height:1.1;letter-spacing:-.01em;color:var(--forest);margin:0 0 14px}
h3{font-family:var(--display);font-weight:700;font-size:22px;line-height:1.2;margin:0 0 6px;color:var(--ink)}
.prose{max-width:780px}
.prose ul{padding-left:20px}
.prose li{margin:6px 0}
.prose code,.formula{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.92em;background:var(--sage);color:var(--forest);padding:2px 7px;border-radius:8px}
.formula{display:block;padding:12px 16px;border-radius:14px;margin:0 0 14px;white-space:normal;overflow-wrap:anywhere}
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:14px}
.section-card{display:block;background:var(--paper);border:1px solid var(--line);border-radius:18px;padding:18px 20px;text-decoration:none;color:var(--ink);transition:border-color .2s,transform .2s}
.section-card:hover{border-color:var(--forest-mid);transform:translateY(-2px);color:var(--ink)}
.section-card h3{font-size:19px;margin:0 0 6px}
.section-card p{margin:0;font-size:14px;color:var(--muted)}
.note{background:var(--sage);border-radius:18px;padding:16px 20px;font-size:15px;color:var(--forest)}
.cta{background:var(--forest);color:var(--linen);border-radius:28px;padding:34px clamp(22px,4vw,48px);margin:10px 0}
.cta h2{color:var(--linen)}
.cta p{color:rgba(250,247,242,.82);max-width:620px}
.cta .btn-ghost{color:var(--linen);border-color:rgba(250,247,242,.6)}
.cta .btn-ghost:hover{background:var(--linen);color:var(--forest)}
.actions{display:flex;flex-wrap:wrap;gap:12px}
footer{border-top:1px solid var(--line);padding:28px 0 40px;font-size:14px;color:var(--muted)}
footer .wrap{display:flex;flex-wrap:wrap;gap:12px 22px;justify-content:space-between}
footer a{color:var(--muted)}

/* ---------- planner ---------- */
.planner{display:grid;grid-template-columns:minmax(0,1fr);gap:18px;align-items:start}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:22px;padding:20px;min-width:0}
.panel-h{font-size:24px;margin:0 0 12px}
.field{margin:0 0 14px;min-width:0}
fieldset.field{border:0;padding:0}
.field label,.field legend{display:block;font-weight:700;font-size:14px;color:var(--ink);margin:0 0 5px;padding:0}
.field .opt{font-weight:600;color:var(--muted)}
.field label.sub{font-weight:600;color:var(--muted);font-size:13px}
.planner input[type=text],.planner input[type=date],.planner select{width:100%;min-width:0;font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1.5px solid var(--line);border-radius:12px;padding:10px 12px;min-height:46px;-webkit-appearance:none;appearance:none}
.planner input[type=date]{display:block}
.planner select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23376950' stroke-width='2' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px;text-overflow:ellipsis}
.planner input:focus,.planner select:focus{outline:none;border-color:var(--forest-mid);box-shadow:0 0 0 3px rgba(55,105,80,.18)}
.planner :focus-visible{outline:3px solid rgba(55,105,80,.35);outline-offset:2px}
.row2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 12px;align-items:end}
.seg{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;background:var(--linen);border:1px solid var(--line);border-radius:14px;padding:4px}
.seg label{margin:0;position:relative}
.seg input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer}
.seg span{display:block;text-align:center;font-size:14px;font-weight:700;padding:9px 4px;border-radius:10px;color:var(--muted);cursor:pointer}
.seg input:checked+span{background:var(--forest);color:#fff}
.seg input:focus-visible+span{outline:3px solid rgba(55,105,80,.35)}
.hint{font-size:13px;color:var(--muted);margin:6px 0 0;min-height:1em}
.trail-link{display:inline-block;margin-top:8px;font-size:14px;font-weight:800;color:var(--ember-deep);text-decoration:none}
.trail-link:hover{color:var(--ember);text-decoration:underline}
.trail-link[hidden]{display:none}
.share{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:4px}
.share span{font-size:13px;color:var(--muted)}
.results{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:14px;min-width:0}
.card{background:var(--paper);border:1px solid var(--line);border-radius:20px;padding:18px 20px 16px;display:flex;flex-direction:column;min-width:0}
.card h3{font-size:15px;font-family:var(--body);font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin:0 0 6px}
.card.focus{grid-column:1/-1;border:2px solid var(--ember);box-shadow:var(--shadow);background:linear-gradient(180deg,#fff7f1 0,var(--paper) 120px)}
.card.focus h3{color:var(--ember-deep)}
.card-body{flex:1;font-size:15px}
.card-body p{margin:0 0 8px}
.card .big{font-family:var(--display);font-weight:800;font-size:38px;line-height:1.05;color:var(--forest);margin:0;letter-spacing:-.01em}
.card.focus .big{font-size:clamp(40px,7vw,56px)}
.card .big-sub{font-size:.6em;color:var(--muted);font-weight:700}
.card .big-label{font-size:14px;color:var(--muted);font-weight:700;margin:2px 0 12px}
.card .small{font-size:13.5px}
.card .muted,.muted{color:var(--muted)}
.kv{margin:0 0 10px;display:grid;gap:4px}
.kv div{display:flex;justify-content:space-between;gap:12px;border-bottom:1px dashed var(--line);padding:4px 0}
.kv div:last-child{border-bottom:0}
.kv dt{color:var(--muted);font-size:14px}
.kv dd{margin:0;font-weight:800;text-align:right;font-size:14.5px}
.meter{position:relative;height:10px;border-radius:999px;background:var(--sage);overflow:hidden;margin:2px 0 4px}
.meter-fill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--forest-mid)}
.meter-fill.lvl-moderate{background:#c99a2e}
.meter-fill.lvl-hard{background:var(--ember-deep)}
.meter i{position:absolute;top:0;bottom:0;width:2px;background:var(--paper)}
.meter-scale{display:flex;justify-content:space-between;font-size:12px;color:var(--muted);margin:0 0 12px}
.meter-scale span:nth-child(2){margin-left:10%}
.card .open{margin-top:10px;padding-top:10px;border-top:1px solid var(--line);font-size:13px;font-weight:800;color:var(--ember-deep);text-decoration:none;align-self:stretch}
.card .open:hover{color:var(--ember);text-decoration:underline}
.faq details{background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:0 18px;margin:0 0 10px}
.faq summary{cursor:pointer;font-weight:800;padding:14px 0;list-style:none;display:flex;justify-content:space-between;gap:12px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-weight:800;color:var(--ember-deep);font-size:20px;line-height:1}
.faq details[open] summary::after{content:"–"}
.faq details p{margin:0 0 14px;color:var(--ink)}
.how h3{margin-top:22px;font-size:20px}
.how p{margin:0 0 12px}
noscript p{background:var(--ember-soft);color:#8a3a17;border-radius:14px;padding:12px 16px;font-weight:700}
/* phones/tablets: the page's own result card comes before the form */
@media (max-width:979px){.results{display:contents}.planner-form{order:1}.card{order:2}.card.focus{order:0}}
@media (min-width:980px){
  .planner{grid-template-columns:380px minmax(0,1fr)}
  .planner-form{position:sticky;top:80px;max-height:calc(100vh - 96px);overflow:auto}
}
@media (max-width:640px){body{font-size:16px}.nav-links .hide-sm{display:none}.nav-links{gap:12px}.nav-links .btn{padding:10px 14px;font-size:14px}.panel{padding:16px}.card{padding:16px}.results{grid-template-columns:minmax(0,1fr)}}
@media (max-width:380px){.nav img{height:26px}.nav-links a.lang{font-size:13px}}
@media (prefers-reduced-motion:reduce){*{transition:none!important}}
.inline-actions{display:flex;flex-wrap:wrap;gap:8px;margin:4px 0 6px}
.inline-actions .btn{font-size:13.5px;padding:8px 14px}
.card .attr{margin:8px 0 0;font-size:12.5px}.card .attr a{color:var(--muted)}

/* ---------- language menu (7 languages) ---------- */
.lang-menu{position:relative}
.lang-menu summary{list-style:none;cursor:pointer;display:inline-flex;align-items:center;gap:6px;padding:6px 2px;font-size:14px;font-weight:700;color:var(--muted);border-radius:8px}
.lang-menu summary::-webkit-details-marker{display:none}
.lang-menu summary svg{width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.8}
.lang-menu summary::after{content:"";width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);margin-inline-start:2px}
.lang-menu summary:hover,.lang-menu[open] summary{color:var(--forest)}
.lang-menu summary:focus-visible{outline:3px solid rgba(55,105,80,.35);outline-offset:2px}
.lang-list{position:absolute;top:calc(100% + 10px);inset-inline-end:0;z-index:30;min-width:180px;display:grid;gap:2px;padding:6px;background:var(--paper);border:1px solid var(--line);border-radius:14px;box-shadow:var(--shadow)}
.nav-links .lang-list a{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:8px 12px;border-radius:10px;font-size:14px;font-weight:700;color:var(--ink);text-decoration:none}
.nav-links .lang-list a:hover{background:var(--sage)}
.nav-links .lang-list a[aria-current]{background:var(--forest);color:#fff}
.lang-list small{font-size:11.5px;font-weight:800;letter-spacing:.06em;color:var(--muted)}
.lang-list a[aria-current] small{color:rgba(255,255,255,.75)}
@media (max-width:380px){.lang-menu summary{font-size:13px}}

/* ---------- right-to-left (Arabic) ---------- */
html[dir=rtl]{--display:"Noto Sans Arabic","Bricolage Grotesque",sans-serif;--body:"Noto Sans Arabic","Manrope",system-ui,-apple-system,"Segoe UI",sans-serif}
html[dir=rtl] h1,html[dir=rtl] h2,html[dir=rtl] h3,html[dir=rtl] .eyebrow,html[dir=rtl] .card h3,html[dir=rtl] .card .big,html[dir=rtl] .lang-list small{letter-spacing:0}
html[dir=rtl] .hero h1{line-height:1.3}
html[dir=rtl] h2{line-height:1.35}
html[dir=rtl] .eyebrow{font-size:14px}
html[dir=rtl] .card h3{font-size:16px}
html[dir=rtl] .prose ul{padding-left:0;padding-right:20px}
html[dir=rtl] .planner select{background-position:left 14px center;padding-right:12px;padding-left:38px}
html[dir=rtl] .planner input[type=text]{direction:ltr;text-align:right}
html[dir=rtl] .kv dd{text-align:left}
html[dir=rtl] .meter{transform:scaleX(-1)}
html[dir=rtl] .meter-scale span:nth-child(2){margin-left:0;margin-right:10%}
html[dir=rtl] .prose code,html[dir=rtl] .formula{font-family:var(--body);font-weight:600;font-size:.95em}

/* ---------- 2026-10 look: calmer cards, visual results, steppers, phone summary bar ---------- */
.eyebrow.hand{font-family:"Caveat",cursive;font-weight:600;font-size:26px;letter-spacing:0;text-transform:none;display:inline-block;transform:rotate(-2deg);transform-origin:left center}
.panel{border:1.5px solid #e6dfd0;border-radius:24px}
.planner input[type=text],.planner input[type=date],.planner select{border-radius:14px;min-height:50px;border-color:#ddd5c4}
.stepper{display:flex;align-items:stretch;border:1.5px solid #ddd5c4;border-radius:14px;background:#fff;overflow:hidden}
.stepper:focus-within{border-color:var(--forest-mid);box-shadow:0 0 0 3px rgba(55,105,80,.18)}
.planner .stepper input[type=text]{border:0;border-radius:0;box-shadow:none;text-align:center;font-weight:800;font-size:18px;min-width:0;flex:1;padding:8px 2px}
.stepper .step{flex:0 0 44px;border:0;background:transparent;font:600 22px/1 var(--body);color:var(--forest);cursor:pointer;min-height:48px}
.stepper .step:hover{background:var(--sage)}
.seg{background:#efe8da;border:0;border-radius:16px;padding:4px;gap:4px}
.seg span{border-radius:12px;padding:11px 4px;color:var(--forest)}
.seg input:checked+span{background:var(--paper);color:var(--forest);box-shadow:0 2px 8px -2px rgba(23,63,48,.3)}
.card{border:1.5px solid #e9e2d4;border-radius:24px}
.card.focus{background:var(--forest);color:var(--linen);border:0;box-shadow:0 22px 50px -24px rgba(23,63,48,.6)}
.card.focus h3{color:rgba(250,247,242,.72)}
.card.focus .big{color:var(--linen)}
.card.focus .big-label,.card.focus .muted,.card.focus .big-sub,.card.focus .kv dt,.card.focus .vis-cap,.card.focus .db-scale{color:rgba(250,247,242,.74)}
.card.focus .kv div{border-bottom-color:rgba(250,247,242,.18)}
.card.focus .open{color:#ffc58f;border-top-color:rgba(250,247,242,.18)}
.card.focus .btn-ghost{color:var(--linen);border-color:rgba(250,247,242,.6)}
.card.focus .attr a{color:rgba(250,247,242,.74)}
/* visuals */
.vis-row{display:flex;flex-wrap:wrap;align-items:flex-end;gap:4px;margin:2px 0 4px}
.vis-cap{font-size:13px;color:var(--muted);margin:0 0 10px!important}
.vis-more{font:800 13px var(--body);color:var(--muted);align-self:center;margin-inline-start:4px}
.v-cap{fill:#9db3aa}.v-glass{fill:#eef6fb;stroke:#9db3aa;stroke-width:1.6}.v-water{fill:#5aaee8}
.v-simit{fill:#e0a15e}.v-hole{fill:var(--paper)}.v-bar{fill:#d9a35c}.v-seed{stroke:#fff2d9;stroke-width:1.6;stroke-linecap:round;fill:none}
.card.focus .v-glass{fill:rgba(250,247,242,.1)}.card.focus .v-hole{fill:var(--forest)}
.gauge{float:inline-end;margin:-6px 0 4px 10px}
.gauge path{fill:none;stroke-width:12}
.gauge .g-easy{stroke:#cfe8d4}.gauge .g-mod{stroke:#fce3a1}.gauge .g-hard{stroke:#f8b99b}
.gauge .g-needle{transform-origin:60px 62px;transition:transform .5s cubic-bezier(.3,1.4,.5,1)}
.gauge .g-needle path{stroke:var(--ink);stroke-width:3.5;stroke-linecap:round}
.gauge .g-hub{fill:var(--ink)}
.card.focus .gauge .g-needle path{stroke:var(--linen)}.card.focus .gauge .g-hub{fill:var(--linen)}
.daybar{position:relative;height:26px;border-radius:10px;background:#e9e3d6;margin:14px 0 6px;overflow:hidden}
.daybar span{position:absolute;top:0;bottom:0}
.db-light{background:#cfe3d3}
.db-walk{top:5px!important;bottom:5px!important;border-radius:6px;background:var(--ember)}
.card.focus .daybar{background:#24443a}.card.focus .db-light{background:#43705f}.card.focus .db-walk{background:#ffc93c}
.db-scale{display:flex;justify-content:space-between;gap:8px;font-size:12px;color:var(--muted);margin:0 0 10px}
html[dir=rtl] .daybar{transform:scaleX(-1)}
/* tool cards */
.section-card{display:flex;flex-direction:column;gap:8px;border:1.5px solid #e9e2d4;border-radius:22px}
.tool-ico{width:44px;height:44px;border-radius:14px;display:flex;align-items:center;justify-content:center;color:var(--forest);background:var(--sage)}
.tool-time .tool-ico,.tool-pack .tool-ico{background:#fff0c2}
.tool-water .tool-ico{background:#ddf0ff}
.tool-calories .tool-ico,.tool-daylight .tool-ico{background:#ffe4d9}
.tool-difficulty .tool-ico,.tool-weather .tool-ico{background:#e1f2e5}
/* phone summary bar */
.sumbar[hidden]{display:none}
@media (max-width:979px){
  body{padding-bottom:84px}
  .sumbar{position:fixed;left:0;right:0;bottom:0;z-index:20;display:flex;align-items:center;gap:12px;padding:10px 16px calc(12px + env(safe-area-inset-bottom));background:rgba(250,247,242,.96);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-top:1px solid var(--line)}
  .sumbar p{margin:0;flex:1;min-width:0;line-height:1.3}
  .sumbar strong{display:block;font-family:var(--display);font-weight:800;font-size:19px;color:var(--forest)}
  .sumbar span{font-size:13px;color:var(--muted)}
  .sumbar .btn{min-width:52px;min-height:48px;padding:0 16px;border-radius:14px}
}
@media (min-width:980px){.sumbar{display:none!important}}

/* 2026-10 trail-sign look: narrow uppercase headlines, straighter cards, contour lines */
html:not([dir=rtl]) .hero h1,html:not([dir=rtl]) h2{font-stretch:75%;font-variation-settings:"wdth" 75;text-transform:uppercase;letter-spacing:0;line-height:.92}
html:not([dir=rtl]) .hero h1{font-size:clamp(40px,6.6vw,72px)}
html:not([dir=rtl]) h2{font-size:clamp(28px,4.2vw,46px)}
.btn{border-radius:6px}.card,.panel,.section-card{border-radius:10px}
.card.focus,.cta{border-radius:10px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='600' height='360' viewBox='0 0 600 360' fill='none' stroke='%23faf7f2' stroke-opacity='.11'%3E%3Cpath d='M-10 70C90 20 180 120 300 60S500 10 610 70'/%3E%3Cpath d='M-10 110C90 60 190 160 305 100S500 50 610 110'/%3E%3Cpath d='M-10 150C100 105 200 200 312 142S500 90 610 150'/%3E%3Cpath d='M-10 190C105 150 210 240 320 184S500 130 610 190'/%3E%3Cpath d='M-10 230C110 195 220 280 330 226S500 170 610 230'/%3E%3Cpath d='M150 360C210 300 350 300 410 360'/%3E%3Cpath d='M190 360C240 318 320 318 370 360'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right -80px top -40px}

/* packing checklist, shown at the top of every tool page */
.pack-hero{display:flex;align-items:center;gap:16px 20px;flex-wrap:wrap;margin:6px 0 22px;padding:18px 20px;border-radius:10px;background:#fff7e0;border:2px solid #f7c948;color:var(--ink);text-decoration:none}
.pack-hero:hover{border-color:var(--ember)}
.pack-hero svg{flex:none;width:44px;height:44px;padding:9px;border-radius:10px;background:#f7c948;color:#14110a;box-sizing:border-box}
.pack-hero .ph-t{flex:1 1 260px;display:flex;flex-direction:column;gap:2px}
.pack-hero .ph-t b{font-family:var(--display);font-size:20px;color:var(--forest)}
.pack-hero .ph-t span{font-size:14.5px;color:var(--muted)}
html:not([dir=rtl]) .pack-hero .ph-t b{font-stretch:75%;font-variation-settings:"wdth" 75;text-transform:uppercase;font-size:24px}
