/* PIVOT v1 - field guide meets indie zine: charcoal, terracotta, Playfair + Inter */
:root{
  --char:#171714; --char-2:#1e1e1a; --char-3:#26261f;
  --bone:#ece6d6; --bone-dim:#a9a294;
  --terra:#d1542c; --terra-hot:#e8643a;
  --line-d:#3a3a30;
}
body{
  background:var(--char) !important;
  color:var(--bone) !important;
  font-family:'Inter',system-ui,-apple-system,sans-serif !important;
}
/* one serif for headlines, one sans for body - nothing else */
.brand,.hero h1,.section-title,.trip-summary h3,.day-card .day-no,.day-card h4,.trip-notes h4,.anti-line,.mood{
  font-family:'Playfair Display',Georgia,serif !important;
}
.brand-dot{ color:var(--terra); }
.brand-tag{ color:var(--bone-dim); }

/* grain - heavier, tactile */
body::after{ opacity:0.075 !important; }

/* hero: asymmetric stagger */
.kicker{ color:var(--terra); }
.hero h1{ color:var(--bone); }
.hero h1 em{ color:var(--terra) !important; }
.hero h1{ }
@media (min-width: 900px){
  .hero h1{ margin-left:6vw; }
  .kicker{ margin-left:0; }
  .hero-sub{ margin-left:12vw; max-width:560px; }
  .hero-stats{ margin-left:12vw; }
}
.hero-sub{ color:var(--bone-dim); }
.hero-stats{ color:var(--bone); }
.hero-stats .sep{ color:var(--terra); }
.ridge path{ fill:var(--terra); }
.ridge path:last-child{ fill:var(--char-3); }

/* planner: offset, rotated a hair, dark card */
.planner{
  background:var(--char-2);
  border:1px solid var(--line-d);
  border-radius:4px;
  box-shadow:14px 14px 0 rgba(209,84,44,0.14);
}
@media (min-width: 900px){
  .planner{ margin-left:8vw; margin-right:0; max-width:880px; transform:rotate(-0.35deg); }
  .planner > *{ transform:rotate(0.35deg); }
}
.section-title{ color:var(--bone); }
.section-sub{ color:var(--bone-dim); }
label{ color:var(--bone); }
.label-note,.region-note{ color:var(--bone-dim); }
select,input[type=text]{
  background:var(--char) !important; color:var(--bone) !important;
  border:1px solid var(--line-d) !important; border-radius:2px !important;
}
.freetext-row input{ border:1px dashed var(--line-d) !important; }
.freetext-row label{ color:var(--bone-dim); }
.chip{
  background:transparent; color:var(--bone); border:1px solid var(--line-d); border-radius:2px;
}
.chip.on{ background:var(--terra); color:#fff; border-color:var(--terra); }
.chip:hover{ border-color:var(--terra-hot); }
.btn-primary{
  background:var(--terra); border-radius:2px; letter-spacing:0.02em;
}
.btn-primary:hover{ background:var(--terra-hot); }
.btn-ghost{
  color:var(--bone); border:1px solid var(--bone-dim); border-radius:2px;
}
.btn-ghost:hover{ border-color:var(--terra); color:var(--terra-hot); }
input[type=range]{ accent-color:var(--terra); }
::selection{ background:var(--terra); color:#fff; }
select:focus,input:focus,button:focus-visible{ outline-color:var(--terra); }

/* results: near-black summary, terracotta details */
.trip-summary{
  background:var(--char-2); color:var(--bone); border:1px solid var(--line-d); border-radius:4px;
}
.trip-summary .trip-code{ color:var(--terra); }
.trip-summary h3{ color:var(--bone); }
.trip-summary .base{ color:var(--bone-dim); }
.trip-summary dt{ color:var(--terra); }
.trip-summary dd{ color:var(--bone); }
.trip-summary .warn{ background:rgba(209,84,44,0.16); border-color:rgba(209,84,44,0.55); color:var(--bone); }
.day-card{
  background:var(--char-2); border:1px solid var(--line-d); border-radius:4px;
}
.day-card .day-no{ color:var(--terra); }
.day-card h4{ color:var(--bone); }
.day-card p{ color:var(--bone-dim); }
.day-card .log{ border-top:1px dashed var(--line-d); color:var(--bone-dim); }
.day-card .log strong{ color:var(--bone); }
.tag{ color:var(--bone); background:var(--char-3); }
.trip-notes{ background:var(--char-2); border:1px solid var(--line-d); border-radius:4px; }
.trip-notes h4{ color:var(--bone); }
.trip-notes ul{ color:var(--bone-dim); }
.copied{ color:var(--terra-hot); }

/* documentary photo treatment */

/* anti: the refusal list, loud */
.anti{
  border-left:4px solid var(--terra); padding-left:26px; max-width:900px;
}
@media (min-width: 900px){ .anti{ margin-left:0; } }
.anti .section-title{ color:var(--terra); }
.anti-line{ color:var(--bone); }
.anti-sub{ color:var(--bone-dim); }

/* footer */
.site-footer{ border-top:1px solid var(--line-d); color:var(--bone-dim); }

/* region accent vars no longer recolor the dark base */
body[data-region]{ --paper:#171714; --paper-2:#26261f; --ink:#ece6d6; --pine:#1e1e1a; --rust:#d1542c; --gold:#d1542c; --line:#3a3a30; --soft:#a9a294; }

/* print stays paper */
@media print{
  body{ background:#fff !important; color:#1c1c1c !important; }
  .trip-summary{ background:#fff !important; color:#1c1c1c !important; border:1px solid #ccc; }
  .trip-summary h3, .trip-summary .mood, .trip-summary p, .trip-summary dd, .trip-summary .base{ color:#1c1c1c !important; }
  .trip-summary dt, .trip-summary .trip-code, .trip-summary .edition{ color:#7b3f33 !important; }
  .trip-summary .warn{ background:#fdeee6 !important; color:#1c1c1c !important; border-color:#d9a08a !important; }
  .day-card{ background:#fff !important; border:1px solid #ccc; }
  .day-card h4, .day-card p, .trip-notes h4, .trip-notes ul{ color:#1c1c1c !important; }
  .day-card .day-no{ color:#7b3f33 !important; }
  .day-card .log, .day-card .log strong{ color:#555 !important; }
  .tag{ background:#eee !important; color:#333 !important; }
  .trip-notes{ background:#fff !important; border:1px solid #ccc; }
  }

/* day-card images - documentary treatment, credits preserved */
.day-photo { margin:10px 0 14px; }
.day-photo img { width:100%; height:210px; object-fit:cover; border-radius:2px; display:block;
  filter:contrast(1.07) saturate(0.8) brightness(0.97); }
.day-photo figcaption { font-size:10.5px; color:var(--bone-dim); margin-top:5px; line-height:1.35; }
.day-photo figcaption a { color:inherit; text-decoration:underline; }
@media (max-width:560px){ .day-photo img { height:180px; } }
@media print { .day-photo { display:none !important; } }

/* hero tagline: V3 treatment (Sanjeet's pick 7 Sep) - Inter caps + terracotta bar, left-aligned */
.hero h1 em{
  font-family:'Inter',sans-serif !important;
  font-style:normal !important;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:0.14em;
  font-size:0.42em;
  display:inline-block;
  border-left:4px solid var(--terra);
  padding-left:0.5em;
  color:var(--bone) !important;
}
@media (min-width: 900px){
  .hero-sub{ margin-left:6vw !important; }
  .hero-stats{ margin-left:6vw !important; }
}

/* planner controls into the dark system */
.planner select{
  background-color:var(--char-3) !important;
  color:var(--bone) !important;
  border:1px solid var(--line-d) !important;
  border-radius:4px !important;
  -webkit-appearance:none; appearance:none;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path d="M1 1l5 5 5-5" fill="none" stroke="%23d1542c" stroke-width="2"/></svg>') !important;
  background-repeat:no-repeat !important;
  background-position:right 14px center !important;
  background-size:12px !important;
  padding-right:38px !important;
}
.planner select:focus{
  outline:2px solid var(--terra) !important;
  outline-offset:1px !important;
  border-color:var(--terra) !important;
}
.planner select option{ background:var(--char-2); color:var(--bone); }
.planner .freetext-row input{
  background:var(--char-3) !important;
  color:var(--bone) !important;
  border:1px dashed var(--line-d) !important;
  border-radius:4px !important;
}
.planner .freetext-row input:focus{
  outline:2px solid var(--terra) !important;
  outline-offset:1px !important;
  border-color:var(--terra) !important;
}
.planner .freetext-row input::placeholder{ color:var(--bone-dim); opacity:0.75; }
.planner .freetext-row label{ color:var(--bone-dim) !important; }
.planner input[type="range"]{
  -webkit-appearance:none; appearance:none;
  background:transparent; height:28px; width:100%;
}
.planner input[type="range"]::-webkit-slider-runnable-track{
  height:4px; background:var(--char-3); border:1px solid var(--line-d); border-radius:2px;
}
.planner input[type="range"]::-webkit-slider-thumb{
  -webkit-appearance:none; appearance:none;
  width:18px; height:18px; border-radius:50%;
  background:var(--terra); border:2px solid var(--char);
  margin-top:-9px; cursor:pointer;
}
.planner input[type="range"]::-moz-range-track{
  height:4px; background:var(--char-3); border:1px solid var(--line-d); border-radius:2px;
}
.planner input[type="range"]::-moz-range-thumb{
  width:14px; height:14px; border-radius:50%;
  background:var(--terra); border:2px solid var(--char); cursor:pointer;
}
.planner output{ color:var(--terra); font-weight:600; }
.planner label{ color:var(--bone) !important; }
.planner .label-note{ color:var(--bone-dim) !important; }

/* themed dropdown proxy (native select popups are OS chrome on mobile) */
.ot-hidden-select{ display:none !important; }
.ot-btn{
  width:100%; text-align:left; cursor:pointer; font:inherit; font-size:15px;
  padding:12px 38px 12px 14px;
  background-color:var(--char-3); color:var(--bone);
  border:1px solid var(--line-d); border-radius:4px;
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8" viewBox="0 0 12 8"><path d="M1 1l5 5 5-5" fill="none" stroke="%23d1542c" stroke-width="2"/></svg>');
  background-repeat:no-repeat; background-position:right 14px center; background-size:12px;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.ot-btn:focus{ outline:2px solid var(--terra); outline-offset:1px; border-color:var(--terra); }
.ot-back{
  position:fixed; inset:0; z-index:90; background:rgba(10,10,9,.62);
  opacity:0; pointer-events:none; transition:opacity .18s ease;
}
.ot-back.on{ opacity:1; pointer-events:auto; }
.ot-pop{
  position:fixed; z-index:91; background:var(--char-2); border:1px solid var(--line-d);
  border-radius:8px; box-shadow:0 18px 50px rgba(0,0,0,.55);
  opacity:0; transform:translateY(-4px); pointer-events:none;
  transition:opacity .16s ease, transform .16s ease;
}
.ot-pop.on{ opacity:1; transform:none; pointer-events:auto; }
.ot-head{
  display:none; align-items:center; justify-content:space-between;
  padding:11px 14px; border-bottom:1px solid var(--line-d);
  font-size:11px; letter-spacing:.16em; text-transform:uppercase; color:var(--terra);
}
.ot-x{ background:none; border:none; color:var(--bone); opacity:.7; font-size:20px; line-height:1; cursor:pointer; padding:0 2px; }
.ot-list{ max-height:320px; overflow-y:auto; }
.ot-item{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  width:100%; padding:13px 14px; background:none; border:none;
  border-bottom:1px solid rgba(214,207,193,.08);
  color:var(--bone); font:inherit; font-size:15px; text-align:left; cursor:pointer;
}
.ot-item:last-child{ border-bottom:none; }
.ot-item:hover,.ot-item:active{ background:rgba(209,84,44,.13); }
.ot-item.sel{ color:var(--terra); font-weight:600; }
.ot-radio{
  flex:none; width:17px; height:17px; border-radius:50%;
  border:1.5px solid var(--bone-dim); opacity:.8;
}
.ot-item.sel .ot-radio{
  border-color:var(--terra); opacity:1;
  background:radial-gradient(circle, var(--terra) 0 46%, transparent 52%);
}
body.ot-lock{ overflow:hidden; }
@media (max-width:640px){
  .ot-head{ display:flex; }
  .ot-pop{
    left:0 !important; right:0; bottom:0; top:auto !important;
    width:auto !important; margin:0 10px 10px;
    border-radius:14px; transform:translateY(12px);
  }
  .ot-pop.on{ transform:none; }
  .ot-list{ max-height:52vh; }
  .ot-item{ padding:15px 14px; font-size:16px; }
}