:root{
  --ink:#0f0d0b;
  --paper:#f4ece0;
  --paper-2:#ebe0cd;
  --hot:#ff3b1f;
  --acid:#c7ff3f;
  --violet:#5b2df0;
  --rule:1px solid var(--ink);
}

*{box-sizing:border-box;margin:0;padding:0}
html,body{background:var(--paper);color:var(--ink);-webkit-font-smoothing:antialiased}
body{font-family:'Space Grotesk',system-ui,sans-serif;font-size:16px;line-height:1.55;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit}

/* ============ MASTHEAD ============ */
.masthead{
  border-bottom:3px solid var(--ink);
  padding:16px clamp(16px,4vw,48px) 8px;
  background:var(--paper);
}
.masthead-row{
  display:flex;justify-content:space-between;align-items:center;
  font-family:'Space Grotesk',sans-serif;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;
  padding:6px 0;
  border-bottom:var(--rule);
}
.masthead-row.bottom{border-bottom:none;border-top:var(--rule);flex-wrap:wrap;gap:8px}
.masthead-row.bottom span{opacity:.85}
.logo{
  font-family:'Fraunces',serif;
  font-weight:900;
  font-variation-settings:'opsz' 144,'SOFT' 40;
  font-size:clamp(64px,16vw,220px);
  line-height:.85;
  letter-spacing:-.04em;
  text-align:center;
  padding:18px 0 12px;
  font-style:italic;
}
.logo .amp{font-style:normal}

/* ============ HERO ============ */
.hero{padding:clamp(28px,6vw,72px) clamp(16px,4vw,48px);border-bottom:var(--rule)}
.hero-grid{display:grid;grid-template-columns:1fr;gap:32px;align-items:end}
@media(min-width:900px){.hero-grid{grid-template-columns:1.05fr .95fr;gap:56px}}

.kicker{
  font-family:'Space Grotesk',sans-serif;
  font-size:12px;font-weight:600;
  letter-spacing:.22em;text-transform:uppercase;
  color:var(--hot);
  margin-bottom:14px;
}
.kicker.light{color:var(--acid)}
.headline{
  font-family:'Fraunces',serif;
  font-weight:600;
  font-size:clamp(40px,7.5vw,88px);
  line-height:.98;
  letter-spacing:-.02em;
  margin-bottom:20px;
}
.headline em{font-style:italic;color:var(--hot);font-variation-settings:'opsz' 144,'SOFT' 60}
.dek{
  font-family:'Fraunces',serif;
  font-size:clamp(18px,2.2vw,22px);
  line-height:1.45;
  max-width:52ch;
  margin-bottom:22px;
}
.byline{
  display:flex;gap:10px;flex-wrap:wrap;
  font-size:12px;letter-spacing:.16em;text-transform:uppercase;
  padding-top:14px;border-top:var(--rule);
}

.hero-photo{position:relative}
.photo-frame{
  aspect-ratio:4/5;
  width:100%;
  border:var(--rule);
  background:
    radial-gradient(120% 90% at 20% 10%, #ffb3a3 0%, transparent 55%),
    radial-gradient(120% 90% at 80% 90%, #ffe27a 0%, transparent 55%),
    linear-gradient(135deg, var(--hot), var(--violet));
  position:relative;
  overflow:hidden;
}
.photo-frame::after{
  content:'photograph pending';
  position:absolute;inset:auto 0 12px 0;
  text-align:center;font-size:11px;letter-spacing:.24em;text-transform:uppercase;
  color:#fff8;
}
.caption{
  display:block;
  font-size:12px;letter-spacing:.12em;text-transform:uppercase;
  margin-top:10px;padding-top:10px;border-top:var(--rule);
}

/* ============ PULLQUOTE ============ */
.pullquote{
  padding:clamp(40px,8vw,96px) clamp(24px,6vw,72px);
  background:var(--hot);
  color:var(--paper);
  border-bottom:var(--rule);
}
.pullquote blockquote{
  font-family:'Fraunces',serif;
  font-style:italic;
  font-weight:400;
  font-size:clamp(28px,5.5vw,64px);
  line-height:1.05;
  letter-spacing:-.01em;
  max-width:22ch;
}

/* ============ ABOUT ============ */
.about{padding:clamp(40px,7vw,96px) clamp(16px,4vw,48px);border-bottom:var(--rule)}
.about-grid{display:grid;grid-template-columns:1fr;gap:28px}
@media(min-width:900px){.about-grid{grid-template-columns:200px 1fr;gap:64px}}
.about-copy p{
  font-family:'Fraunces',serif;
  font-size:clamp(19px,2.2vw,26px);
  line-height:1.45;
  max-width:62ch;
}
.about-copy p + p{margin-top:16px}
.dropcap{
  float:left;
  font-family:'Fraunces',serif;
  font-weight:800;
  font-size:clamp(64px,10vw,120px);
  line-height:.8;
  padding:6px 12px 0 0;
  color:var(--violet);
  font-style:italic;
}

.section-head{margin-bottom:28px;max-width:900px}
.section-head h3{
  font-family:'Fraunces',serif;
  font-weight:600;
  font-size:clamp(32px,5vw,56px);
  line-height:1;
  letter-spacing:-.02em;
}
.section-head.alt h3{color:var(--paper)}

/* ============ WEARS (many hats) ============ */
.wears{padding:clamp(40px,7vw,96px) clamp(16px,4vw,48px);border-bottom:var(--rule)}
.cards{
  display:grid;grid-template-columns:1fr;gap:16px;
}
@media(min-width:640px){.cards{grid-template-columns:repeat(2,1fr)}}
@media(min-width:1024px){.cards{grid-template-columns:repeat(4,1fr)}}
.card{
  border:var(--rule);
  background:var(--paper-2);
  padding:22px 20px 24px;
  position:relative;
  min-height:220px;
  display:flex;flex-direction:column;justify-content:space-between;
  transition:transform .25s ease, background .25s ease;
}
.card:hover{transform:translate(-3px,-3px);background:#fff}
.card .num{
  font-family:'Space Grotesk',sans-serif;
  font-size:12px;letter-spacing:.2em;color:var(--hot);
}
.card h4{
  font-family:'Fraunces',serif;
  font-weight:700;
  font-style:italic;
  font-size:clamp(28px,3.5vw,40px);
  line-height:1;
  margin:14px 0 10px;
  letter-spacing:-.01em;
}
.card p{font-size:14px;line-height:1.5;opacity:.85}
.card.tint-1{background:#f7d9c9}
.card.tint-2{background:#d9e6f7}
.card.tint-3{background:#e6f7c9}
.card.tint-4{background:#eadaf7}

/* ============ CURRENTLY ============ */
.currently{padding:clamp(40px,7vw,96px) clamp(16px,4vw,48px);border-bottom:var(--rule);background:var(--paper-2)}
.currently-grid{display:grid;grid-template-columns:1fr;gap:28px;align-items:start}
@media(min-width:900px){.currently-grid{grid-template-columns:1fr 1.4fr;gap:64px}}
.currently h3{
  font-family:'Fraunces',serif;font-weight:600;
  font-size:clamp(32px,5vw,56px);line-height:1;letter-spacing:-.02em;
}
.itinerary{list-style:none;border-top:var(--rule)}
.itinerary li{
  display:grid;grid-template-columns:90px 1fr auto;gap:16px;
  padding:16px 0;border-bottom:var(--rule);
  align-items:baseline;
}
.itinerary .when{font-size:12px;letter-spacing:.16em;text-transform:uppercase;opacity:.7}
.itinerary .what{font-family:'Fraunces',serif;font-size:clamp(20px,2.5vw,26px);line-height:1.2}
.itinerary .where{font-size:12px;letter-spacing:.14em;text-transform:uppercase;text-align:right;opacity:.7}

/* ============ GALLERY ============ */
.gallery{padding:clamp(40px,7vw,96px) clamp(16px,4vw,48px);border-bottom:var(--rule)}
.gallery-grid{
  margin-top:20px;
  display:grid;
  grid-template-columns:repeat(6,1fr);
  grid-auto-rows:100px;
  gap:10px;
}
@media(max-width:720px){.gallery-grid{grid-auto-rows:80px}}
.g{
  border:var(--rule);
  position:relative;
  overflow:hidden;
  display:flex;align-items:flex-end;justify-content:flex-start;
  padding:10px;
  font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:#fff;
  transition:transform .25s ease;
}
.g:hover{transform:scale(.98)}
.g span{background:#00000066;padding:4px 8px;backdrop-filter:blur(2px)}
.g-a{grid-column:span 4;grid-row:span 3;background:linear-gradient(135deg,#ff3b1f,#ffb03a)}
.g-b{grid-column:span 2;grid-row:span 2;background:linear-gradient(135deg,#5b2df0,#b96bff)}
.g-c{grid-column:span 2;grid-row:span 2;background:linear-gradient(135deg,#0f0d0b,#4a4038)}
.g-d{grid-column:span 2;grid-row:span 2;background:linear-gradient(135deg,#c7ff3f,#7bbf1c)}
.g-e{grid-column:span 2;grid-row:span 3;background:linear-gradient(135deg,#ff7ab6,#ff3b1f)}
@media(max-width:720px){
  .g-a{grid-column:span 6;grid-row:span 3}
  .g-b,.g-c,.g-d,.g-e{grid-column:span 3;grid-row:span 2}
}

/* ============ WORK ============ */
.work{padding:clamp(40px,7vw,96px) clamp(16px,4vw,48px);background:var(--ink);color:var(--paper);border-bottom:var(--rule)}
.work-grid{display:grid;grid-template-columns:1fr;gap:16px}
@media(min-width:720px){.work-grid{grid-template-columns:repeat(3,1fr)}}
.tile{
  border:1px solid var(--paper);
  padding:24px 22px 26px;
  min-height:220px;
  display:flex;flex-direction:column;justify-content:space-between;
  background:transparent;
  color:var(--paper);
  text-decoration:none;
  transition:background .25s ease,color .25s ease,transform .25s ease;
}
.tile:hover{background:var(--acid);color:var(--ink);transform:translate(-3px,-3px)}
.tile .tag{font-size:11px;letter-spacing:.24em;text-transform:uppercase;opacity:.75}
.tile h4{
  font-family:'Fraunces',serif;font-style:italic;font-weight:600;
  font-size:clamp(26px,3.2vw,36px);line-height:1.02;margin:12px 0 10px;
}
.tile p{font-size:14px;line-height:1.5;opacity:.85}
.tile .go{margin-top:14px;font-size:12px;letter-spacing:.24em;text-transform:uppercase}
.tile:hover p,.tile:hover .tag{opacity:1}

/* ============ LINKS ============ */
.links{padding:clamp(40px,7vw,96px) clamp(16px,4vw,48px)}
.link-list{list-style:none;border-top:var(--rule);margin-top:14px}
.link-list li{border-bottom:var(--rule)}
.link-list a{
  display:grid;grid-template-columns:1fr auto;align-items:center;
  padding:22px 4px;
  text-decoration:none;
  font-family:'Fraunces',serif;
  font-size:clamp(28px,5vw,52px);
  font-weight:500;
  letter-spacing:-.02em;
  transition:color .2s ease, padding .2s ease;
}
.link-list a:hover{color:var(--hot);padding-left:14px}
.link-list .arrow{
  font-family:'Space Grotesk',sans-serif;
  font-size:14px;letter-spacing:.24em;text-transform:uppercase;
}

/* ============ FOOTER ============ */
footer{
  border-top:3px solid var(--ink);
  padding:22px clamp(16px,4vw,48px);
  background:var(--paper);
}
.footer-row{
  display:flex;justify-content:space-between;align-items:center;
  gap:16px;flex-wrap:wrap;
  font-size:12px;letter-spacing:.14em;text-transform:uppercase;
}
.logo-sm{
  font-family:'Fraunces',serif;font-weight:900;font-style:italic;
  font-size:22px;letter-spacing:0;
}

/* ============ TINY DETAILS ============ */
::selection{background:var(--hot);color:var(--paper)}