:root{
  --bg:#f6f5f1;
  --paper:#fffefb;
  --paper-2:#faf9f5;
  --paper-3:#f3f5f8;
  --ink:#171411;
  --muted:#625c56;
  --line:rgba(23,20,17,.1);
  --line-strong:rgba(23,20,17,.18);
  --sage:#5f7b62;
  --sage-soft:#e2ebe2;
  --gold:#b48a45;
  --gold-soft:#ddc088;
  --coal:#181411;
  --shadow:0 30px 70px rgba(37,28,22,.08);
  --radius:32px;
  --content:min(1320px, calc(100vw - 54px));
  --text:'Manrope', sans-serif;
  --display:'Cormorant Garamond', serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  min-height:100vh;
  background:
    radial-gradient(circle at 10% 0%, rgba(180,138,69,.035), transparent 20%),
    radial-gradient(circle at 90% 10%, rgba(95,123,98,.05), transparent 18%),
    radial-gradient(circle at 72% 64%, rgba(139,166,199,.055), transparent 18%),
    linear-gradient(180deg,#ffffff 0%, #f9f9f6 44%, #fdfdfb 100%);
  color:var(--ink);
  font-family:var(--text);
  line-height:1.6;
}

.home-page{
  --page-accent:#b48a45;
  --page-soft:#fbfaf7;
}

.work-page{
  --page-accent:#7f9c80;
  --page-soft:#f3f8f2;
}

.writing-page{
  --page-accent:#c39272;
  --page-soft:#fbfaf7;
}

.about-page{
  --page-accent:#8ba6c7;
  --page-soft:#f2f6fb;
}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}

.page-shell{min-height:100vh}

.site-nav{
  position:sticky;
  top:0;
  z-index:50;
  background:rgba(255,253,250,.9);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--line);
}

.nav-inner{
  width:var(--content);
  margin:0 auto;
  min-height:74px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
}

.brand{
  display:flex;
  align-items:center;
  gap:12px;
  font-family:var(--display);
  font-size:1.28rem;
}

.brand-dot{
  width:18px;
  height:18px;
  background:url("./assets/nav-flower.png") center/contain no-repeat;
  flex:0 0 18px;
}

.nav-links{
  display:flex;
  align-items:center;
  gap:0;
}

.nav-links a{
  padding:0 18px;
  min-height:74px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size:.78rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--muted);
  border-left:1px solid var(--line);
  transition:color .22s ease, background .22s ease, transform .22s ease, box-shadow .22s ease;
}

.nav-links a:hover{
  color:var(--ink);
  background:rgba(255,255,255,.55);
  transform:translateY(-1px);
}

.nav-links a.active{
  color:var(--sage);
  box-shadow:inset 0 -2px 0 var(--sage);
}

.nav-links a.cta{
  min-height:46px;
  padding:0 20px;
  margin-left:14px;
  background:var(--coal);
  color:#fff;
  border-left:none;
  border-radius:0;
}

.nav-links a.cta:hover{
  color:#fff;
  background:#24201d;
  box-shadow:0 16px 26px rgba(23,20,17,.18);
  transform:translateY(-2px) scale(1.02);
}

.section{
  width:100%;
  padding:82px 0;
}

.section-dark{
  background:var(--coal);
  color:#f7f2ea;
}

.section-soft{
  background:var(--page-soft, var(--paper-2));
}

.container{
  width:var(--content);
  margin:0 auto;
}

.eyebrow{
  display:inline-flex;
  align-items:center;
  gap:12px;
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--page-accent, var(--gold));
}

.eyebrow::before{
  content:"";
  width:30px;
  height:1px;
  background:currentColor;
}

.hero-copy .eyebrow{
  color:#5f7b62;
}

h1,h2,h3,h4{
  margin:0;
  font-family:var(--display);
  font-weight:400;
  line-height:1.02;
}

h1{
  font-size:clamp(3rem,5.8vw,5rem);
  letter-spacing:-.045em;
}

h2{
  font-size:clamp(2.2rem,4vw,3.7rem);
  letter-spacing:-.04em;
}

h3{
  font-size:1.72rem;
}

h4{
  font-size:1.12rem;
}

p{margin:0}

.lede{
  max-width:760px;
  font-size:1.02rem;
  color:var(--muted);
}

.section-dark .lede{
  color:rgba(247,242,234,.74);
}

.reveal{
  opacity:0;
  transform:translateY(22px);
  transition:opacity .65s ease, transform .65s ease;
}

.reveal.is-visible{
  opacity:1;
  transform:translateY(0);
}

.hero{
  width:100%;
  min-height:calc(100vh - 118px);
  position:relative;
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  align-items:stretch;
  overflow:hidden;
  background:
    radial-gradient(circle at 78% 18%, rgba(139,166,199,.08), transparent 18%),
    radial-gradient(circle at 16% 72%, rgba(180,138,69,.06), transparent 18%),
    #ffffff;
}

.hero-dense{
  min-height:calc(100vh - 118px);
}

.hero-copy{
  position:relative;
  z-index:2;
  width:auto;
  padding:32px 44px 26px calc((100vw - var(--content)) / 2);
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  gap:14px;
  min-height:100%;
}

.hero-copy h1{
  max-width:720px;
  font-family:var(--text);
  font-size:clamp(2.45rem,3.9vw,3.9rem);
  font-weight:700;
  line-height:1.03;
  letter-spacing:-.055em;
}

.hero-copy h1 em{
  font-family:var(--display);
  font-weight:400;
  font-style:italic;
  color:var(--page-accent, var(--gold));
}

.status-pill{
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:max-content;
  padding:9px 14px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--line);
  color:var(--muted);
  box-shadow:0 12px 22px rgba(30,23,18,.06);
}

.status-pill-portrait{
  position:absolute;
  top:16px;
  right:18px;
  z-index:3;
  padding:0;
  border:none;
  border-radius:0;
  background:transparent;
  box-shadow:none;
  font-size:.76rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  color:rgba(23,20,17,.62);
}

.status-dot{
  width:9px;
  height:9px;
  border-radius:50%;
  background:#6f8f72;
}

.hero-grid-text{
  display:grid;
  grid-template-columns:1fr;
  gap:12px;
  align-items:start;
  max-width:610px;
}

.hero-copy .lede{
  font-size:.98rem;
  line-height:1.62;
}

.hero-note{
  max-width:590px;
  font-size:.92rem;
  line-height:1.66;
  color:var(--muted);
}

.hero-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  margin-top:8px;
  padding-top:0;
}

.hero-proof-points{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:8px;
  max-width:620px;
}

.hero-proof-point{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:999px;
  background:rgba(255,255,255,.92);
  border:1px solid rgba(23,20,17,.1);
  box-shadow:0 10px 24px rgba(30,23,18,.05);
}

.hero-proof-point strong{
  font-size:.92rem;
  font-weight:700;
  line-height:1;
  color:var(--ink);
}

.hero-proof-point span{
  font-size:.8rem;
  color:var(--muted);
  line-height:1;
}

.hero-proof-point:nth-child(1) strong{
  color:#6f8f72;
}

.hero-proof-point:nth-child(2) strong{
  color:#b48a45;
}

.hero-proof-point:nth-child(3) strong{
  color:#8ba6c7;
}

.button{
  min-height:44px;
  padding:0 18px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font-size:.78rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  position:relative;
  overflow:hidden;
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease, border-color .22s ease;
  box-shadow:0 10px 20px rgba(23,20,17,.05);
}

.button::after{
  content:"";
  position:absolute;
  inset:-1px auto -1px -40%;
  width:32%;
  background:linear-gradient(90deg, transparent, rgba(255,255,255,.34), transparent);
  opacity:0;
  transform:skewX(-18deg);
  transition:transform .42s ease, opacity .32s ease;
}

.button.primary{
  background:var(--coal);
  color:#fff;
}

.button.secondary{
  border:1px solid var(--line-strong);
  background:rgba(255,255,255,.5);
}

.button:hover{
  transform:translateY(-3px) scale(1.02);
  box-shadow:0 18px 30px rgba(23,20,17,.12);
}

.button:hover::after{
  opacity:1;
  transform:translateX(360%) skewX(-18deg);
}

.button.primary:hover{
  background:#23201d;
}

.button.secondary:hover{
  background:#fff;
  border-color:rgba(23,20,17,.18);
}

.hero-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:8px;
  max-width:680px;
}

.hero-stats-visual{
  width:100%;
  max-width:none;
  margin-top:0;
}

.hero-stats-compact .hero-stat{
  min-height:100%;
}

.hero-stat{
  padding:16px 18px;
  border-radius:20px;
  border:1px solid var(--line);
  background:linear-gradient(180deg, rgba(255,255,255,.66), rgba(255,255,255,.46));
  position:relative;
  overflow:hidden;
}

.hero-stat::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:0;
  height:3px;
  background:rgba(111,143,114,.28);
}

.hero-stat strong{
  display:block;
  margin-bottom:6px;
  font-size:1.4rem;
  font-weight:700;
  letter-spacing:-.04em;
}

.hero-stats-visual .hero-stat:nth-child(1) strong{
  color:#6f8f72;
}

.hero-stats-visual .hero-stat:nth-child(1)::before{
  background:rgba(111,143,114,.42);
}

.hero-stats-visual .hero-stat:nth-child(2) strong{
  color:#b48a45;
}

.hero-stats-visual .hero-stat:nth-child(2)::before{
  background:rgba(180,138,69,.42);
}

.hero-stats-visual .hero-stat:nth-child(3) strong{
  color:#8ba6c7;
}

.hero-stats-visual .hero-stat:nth-child(3)::before{
  background:rgba(139,166,199,.46);
}

.hero-stat span{
  color:var(--muted);
  font-size:.9rem;
}

.hero-visual{
  position:relative;
  display:flex;
  align-items:stretch;
  justify-content:flex-start;
  overflow:hidden;
  padding:24px calc((100vw - var(--content)) / 2) 0 20px;
  background:transparent;
}

.hero-visual-stack{
  width:100%;
  display:grid;
  grid-template-rows:minmax(0,1fr);
  gap:0;
  position:relative;
}

.hero-visual-clean::before{
  content:none;
}

.portrait-wrap{
  position:relative;
  z-index:1;
  width:100%;
  height:100%;
  min-height:0;
  overflow:hidden;
  display:flex;
  align-items:stretch;
  justify-content:flex-start;
  transform:translate(var(--mx,0), calc(var(--my,0) * .1));
  transition:transform .25s ease;
}

.portrait-cutout{
  filter:drop-shadow(0 26px 32px rgba(20,18,16,.14));
}

.portrait-wrap img{
  position:relative;
  right:auto;
  bottom:auto;
  width:106%;
  height:106%;
  max-height:none;
  object-fit:contain;
  object-position:left bottom;
  transform:translate(-2%, -4.8%);
}

.snapshot-section{
  background:#ffffff;
  position:relative;
}

.snapshot-section::before{
  content:"";
  position:absolute;
  inset:42px auto auto 4%;
  width:180px;
  height:180px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(180,138,69,.08), transparent 70%);
  pointer-events:none;
}

.snapshot-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  align-items:start;
}

.snapshot-card{
  padding:28px 30px;
  border:1px solid rgba(23,20,17,.08);
  border-radius:28px;
  background:#fffdfb;
  box-shadow:0 18px 45px rgba(30,23,18,.04);
  transition:transform .28s ease, box-shadow .28s ease;
}

.snapshot-card:hover,
.proof-card:hover,
.skill-column:hover{
  transform:translateY(-6px) scale(1.01);
  box-shadow:0 24px 50px rgba(30,23,18,.08);
}

.snapshot-card span{
  display:block;
  margin-bottom:12px;
  font-size:.82rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--muted);
}

.snapshot-card p{
  font-size:1rem;
  color:var(--ink);
}

.snapshot-card-large{
  min-height:438px;
  align-self:start;
  position:relative;
  overflow:hidden;
}

.snapshot-card-large::before{
  content:none;
}

.snapshot-card-inner{
  display:grid;
  grid-template-columns:220px 1fr;
  gap:22px;
  align-items:center;
  min-height:100%;
  position:relative;
  z-index:1;
}

.snapshot-graphic{
  position:relative;
  min-height:300px;
  background:
    linear-gradient(180deg, rgba(255,253,249,.72), rgba(255,253,249,.72)),
    url("./assets/snapshot-seed.jpg") center center / cover no-repeat;
  border:none;
  border-radius:0;
}

.snapshot-graphic::before{
  content:none;
}

.snapshot-graphic::after{
  content:none;
}

.snapshot-card-large p{
  max-width:560px;
  font-size:1.04rem;
  line-height:1.78;
  color:var(--muted);
}

.snapshot-stack{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
}

.snapshot-stack .snapshot-card{
  min-height:210px;
}

.tone-green{background:linear-gradient(180deg,#edf7e7,#f8fbf6)}
.tone-pink{background:linear-gradient(180deg,#f8eaef,#fdf9fb)}
.tone-blue{background:linear-gradient(180deg,#e8f1fb,#f8fbff)}
.tone-peach{background:linear-gradient(180deg,#f9ebdf,#fffaf6)}

.tiny{
  display:block;
  margin-bottom:8px;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold);
}


.marquee-band{
  overflow:hidden;
  border-top:1px solid var(--line);
  border-bottom:1px solid var(--line);
  background:linear-gradient(180deg, #fbfcff, #f3f6fb);
}

.marquee-track{
  width:max-content;
  display:flex;
  gap:18px;
  padding:14px 0;
  animation:marquee 24s linear infinite;
}

.marquee-track span{
  padding:8px 14px;
  border-radius:999px;
  border:1px solid rgba(102,132,176,.22);
  background:rgba(139,166,199,.15);
  color:#5f7395;
  font-size:.78rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  white-space:nowrap;
  box-shadow:0 8px 18px rgba(67,86,114,.06);
}

@keyframes marquee{
  from{transform:translateX(0)}
  to{transform:translateX(-50%)}
}

.split{
  display:grid;
  grid-template-columns:1.05fr .95fr;
  gap:40px;
}

.split-balanced{
  align-items:end;
}

.story-section{
  background:linear-gradient(180deg,#ffffff 0%, #f7fbff 100%);
  position:relative;
}

.story-section::after{
  content:"";
  position:absolute;
  right:6%;
  top:22%;
  width:220px;
  height:220px;
  border-radius:50%;
  background:
    radial-gradient(circle at center, rgba(139,166,199,.13), transparent 62%);
  pointer-events:none;
}

.story-section::before{
  content:none;
}

.story-block{
  display:grid;
  gap:34px;
}

.home-page .story-section{
  background:#fffdfb;
}

.story-grid{
  display:grid;
  grid-template-columns:1.22fr .78fr;
  gap:34px;
  align-items:start;
}

.story-copy{
  display:grid;
  gap:12px;
  position:relative;
}

.story-copy .eyebrow{
  margin-top:-8px;
}

.home-page .story-section .eyebrow,
.home-page .snapshot-section .eyebrow,
.home-page .about-preview-band .eyebrow,
.home-page .contact-end-band .eyebrow{
  color:#8ba6c7;
}

.home-page .story-section .eyebrow::before,
.home-page .snapshot-section .eyebrow::before,
.home-page .about-preview-band .eyebrow::before,
.home-page .contact-end-band .eyebrow::before{
  background:#8ba6c7;
}

.home-page .proof-grid .tiny,
.home-page .skills-board .skill-title{
  color:#5f7b62;
}

.story-copy h2{
  max-width:700px;
  font-size:clamp(2.4rem,4.2vw,4rem);
}

.story-side{
  padding-top:24px;
}

.story-side p{
  max-width:440px;
  font-size:1rem;
  line-height:1.75;
  color:var(--muted);
}

.story-process{
  border-top:1px solid rgba(23,20,17,.08);
  padding-top:24px;
}

.story-process-label{
  display:block;
  margin-bottom:20px;
  font-size:.78rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:var(--sage);
}

.story-process-grid{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:26px;
  align-items:start;
}

.story-process-step{
  display:grid;
  justify-items:center;
  text-align:center;
  gap:4px;
  align-content:start;
  position:relative;
  padding-top:28px;
}

.story-process-number{
  display:block;
  margin-top:1px;
  font-size:.78rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:rgba(112,96,73,.72);
}

.story-process-step h3{
  margin:0;
  font-size:1.04rem;
  font-weight:650;
  letter-spacing:.01em;
  color:var(--ink);
}

.story-process-step p{
  margin:0;
  max-width:22ch;
  font-size:.91rem;
  line-height:1.68;
  color:var(--muted);
}

.story-process-step::before{
  content:"";
  width:13px;
  height:13px;
  border-radius:50%;
  position:absolute;
  top:0;
  left:50%;
  transform:translateX(-50%);
  box-shadow:0 0 0 6px rgba(255,255,255,.86);
}

.story-process-step:nth-child(1)::before{
  background:#cadbf0;
}

.story-process-step:nth-child(2)::before{
  background:#cfdccf;
}

.story-process-step:nth-child(3)::before{
  background:#ddd6ef;
}

.story-process-step:nth-child(4)::before{
  background:#ecd8dd;
}

.story-process-step::after{
  content:"";
  position:absolute;
  top:6px;
  left:calc(50% + 20px);
  width:calc(100% - 14px);
  border-top:1px solid rgba(23,20,17,.11);
}

.story-process-step:last-child::after{
  display:none;
}

.story-process-step .story-process-number{
  position:relative;
}

.featured-grid-refined{
  position:relative;
}

.featured-grid-refined::before{
  content:"";
  position:absolute;
  left:-30px;
  top:-26px;
  width:140px;
  height:140px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(127,156,128,.12), transparent 68%);
  pointer-events:none;
}

.featured-grid-refined::after{
  content:"";
  position:absolute;
  right:-12px;
  bottom:28px;
  width:120px;
  height:120px;
  border-radius:32px;
  background:linear-gradient(180deg, rgba(244,231,214,.55), rgba(233,242,239,.55));
  filter:blur(2px);
  z-index:0;
  pointer-events:none;
}

.section-head{
  display:flex;
  justify-content:space-between;
  align-items:end;
  gap:24px;
}

.clean-board-head{
  display:grid;
  gap:10px;
  margin-bottom:28px;
}

.clean-board-head h2{
  max-width:820px;
}

.featured-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px;
  margin-top:32px;
}

.featured-card{
  position:relative;
  min-height:360px;
  overflow:hidden;
  border-radius:32px;
  color:#fff;
  background:#ddd;
  box-shadow:var(--shadow);
  isolation:isolate;
  transition:transform .3s ease, box-shadow .3s ease;
}

.featured-card.large{
  min-height:420px;
}

.featured-card img,
.featured-art{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .55s ease;
}

.featured-card img.fit-contain{
  object-fit:contain;
  background:#f5f1ea;
}

.featured-card img.kaleidoscope-focus,
.archive-card.visual img.kaleidoscope-focus,
.case-media img.kaleidoscope-focus{
  object-position:28% center;
}

.featured-card:hover img,
.featured-card:hover .featured-art{
  transform:scale(1.045);
}

.featured-card:hover{
  transform:translateY(-6px) scale(1.01);
  box-shadow:0 28px 48px rgba(23,20,17,.16);
}

.featured-art{
  display:grid;
  place-items:center;
  padding:22px;
}

.featured-art span{
  align-self:end;
  justify-self:start;
  font-family:var(--display);
  font-size:2.1rem;
  color:rgba(255,255,255,.95);
}

.art-marbles{
  background:
    radial-gradient(circle at 15% 20%, rgba(255,255,255,.38), transparent 18%),
    radial-gradient(circle at 70% 30%, rgba(255,255,255,.22), transparent 16%),
    linear-gradient(135deg,#b8a18f,#7f6457 35%, #eadccf 68%, #aa8d78);
}

.featured-card::after{
  content:"";
  position:absolute;
  inset:0;
  background:linear-gradient(180deg, rgba(12,10,9,.05), rgba(12,10,9,.82));
}

.featured-body{
  position:relative;
  z-index:1;
  display:flex;
  flex-direction:column;
  justify-content:flex-end;
  height:100%;
  padding:24px;
}

.meta{
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(255,255,255,.76);
  margin-bottom:10px;
}

.featured-body h3{
  font-size:1.75rem;
}

.featured-body p{
  color:rgba(255,255,255,.82);
  font-size:.95rem;
  margin-top:8px;
}

.chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:14px;
}

.chip{
  padding:7px 12px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.38);
  font-size:.76rem;
  color:rgba(255,255,255,.96);
  background:rgba(255,255,255,.08);
}

.proof-grid{
  display:grid;
  grid-template-columns:.95fr .95fr 1.1fr;
  gap:18px;
  margin-top:14px;
}

.proof-card{
  min-height:360px;
  border-radius:18px;
  padding:28px;
  background:rgba(255,255,255,.82);
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border:1px solid rgba(23,20,17,.07);
}

.proof-card h3{
  font-size:2rem;
  line-height:1.08;
}

.proof-card p{
  color:var(--muted);
}

.proof-photo{
  margin:12px 0 2px;
  border-radius:16px;
  overflow:hidden;
  border:1px solid rgba(23,20,17,.08);
  background:#f6f0e7;
  max-width:220px;
}

.proof-photo img{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
}

.proof-card.dark{
  background:#151515;
  color:#f4f0e9;
}

.proof-card.dark p{
  color:rgba(244,240,233,.82);
}

.stack-lines,
.stack-pills{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.stack-lines span,
.stack-pills span{
  padding:10px 14px;
  border-radius:999px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.72);
  color:var(--muted);
  font-size:.82rem;
}

.proof-card,
.skill-column{
  transition:transform .28s ease, box-shadow .28s ease;
}

.stack-card{
  background:linear-gradient(180deg,#fffefb,#f3f7f5);
}

.pastel-home-band{
  background:
    radial-gradient(circle at 12% 18%, rgba(244,216,188,.18), transparent 24%),
    radial-gradient(circle at 84% 72%, rgba(214,228,242,.24), transparent 26%),
    linear-gradient(180deg,#fffefb,#f7faf8);
}

.about-preview-band{
  background:
    radial-gradient(circle at 86% 16%, rgba(139,166,199,.14), transparent 18%),
    linear-gradient(180deg,#ffffff,#f3f7fc);
}

.map-layout{
  display:grid;
  grid-template-columns:.95fr 1.05fr;
  gap:28px;
  align-items:start;
}

.about-page .map-layout{
  gap:22px;
}

.text-panels{
  display:grid;
  gap:18px;
  align-content:start;
}

.about-page .text-panels{
  gap:12px;
}

.panel{
  padding:24px;
  border-radius:18px;
  background:rgba(255,255,255,.84);
  border:1px solid var(--line);
  display:grid;
  gap:10px;
}

.panel h3{
  margin-top:2px;
}

.panel p{
  color:var(--muted);
  margin-top:4px;
  line-height:1.72;
}

.about-page .panel{
  padding:20px 22px;
}

.journey-flow{
  position:relative;
  display:grid;
  gap:14px;
  padding-left:28px;
}

.about-page .journey-flow{
  gap:10px;
}

.journey-flow::before{
  content:"";
  position:absolute;
  left:9px;
  top:10px;
  height:calc(100% - 92px);
  width:1px;
  background:linear-gradient(180deg,var(--gold),rgba(180,138,69,.12));
}

.journey-step{
  position:relative;
  padding:0 0 0 18px;
}

.journey-step::before{
  content:"";
  position:absolute;
  left:-28px;
  top:9px;
  width:18px;
  height:18px;
  border-radius:50%;
  background:var(--paper);
  border:1px solid var(--gold);
  box-shadow:0 0 0 5px rgba(180,138,69,.08);
}

.roots-step::before{
  background:#edf7e7;
  border-color:#8bb77f;
  box-shadow:0 0 0 5px rgba(139,183,127,.16);
}

.training-step::before{
  background:#e8f1fb;
  border-color:#8ba6c7;
  box-shadow:0 0 0 5px rgba(139,166,199,.16);
}

.practice-step::before{
  background:#f9ebdf;
  border-color:#d69b67;
  box-shadow:0 0 0 5px rgba(214,155,103,.16);
}

.journey-step strong{
  display:block;
  margin-bottom:4px;
  font-size:1rem;
}

.journey-step span{
  color:var(--muted);
  font-size:.92rem;
}

.about-page .journey-step strong{
  margin-bottom:2px;
}

.map-card{
  position:relative;
  display:block;
  padding:16px;
  border-radius:18px;
  background:rgba(255,255,255,.88);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  overflow:hidden;
}

.map-card img{
  width:100%;
  border-radius:18px;
  transition:transform .55s ease;
}

.zoom-card:hover img{
  transform:scale(1.04);
}

.zoom-label{
  position:absolute;
  right:30px;
  bottom:28px;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(23,20,17,.84);
  color:#fff;
  font-size:.76rem;
  letter-spacing:.08em;
  text-transform:uppercase;
}

.map-modal{
  position:fixed;
  inset:0;
  display:none;
  align-items:center;
  justify-content:center;
  z-index:60;
}

.map-modal.is-open{
  display:flex;
}

.map-modal-backdrop{
  position:absolute;
  inset:0;
  background:rgba(14, 16, 19, .62);
  backdrop-filter:blur(8px);
}

.map-modal-panel{
  position:relative;
  width:min(94vw, 1320px);
  height:min(90vh, 900px);
  display:flex;
  flex-direction:column;
  gap:14px;
  padding:18px;
  border-radius:24px;
  background:#fbfaf7;
  box-shadow:0 32px 80px rgba(0,0,0,.18);
  z-index:1;
}

.map-modal-close{
  position:absolute;
  top:14px;
  right:16px;
  width:42px;
  height:42px;
  border:none;
  border-radius:999px;
  background:rgba(23,20,17,.08);
  color:#171411;
  font-size:1.8rem;
  line-height:1;
  cursor:pointer;
}

.map-modal-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding-right:52px;
}

.map-modal-title{
  font-size:.9rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink-soft);
}

.map-modal-actions{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.map-tool{
  border:1px solid var(--line);
  background:#fff;
  color:var(--ink);
  border-radius:999px;
  padding:10px 14px;
  font:inherit;
  cursor:pointer;
}

.map-tool-link{
  text-decoration:none;
}

.map-viewport{
  position:relative;
  flex:1;
  overflow:hidden;
  border-radius:18px;
  border:1px solid var(--line);
  background:radial-gradient(circle at top left, rgba(133, 163, 213, .1), transparent 30%), #fff;
  cursor:grab;
  touch-action:none;
}

.map-viewport.is-dragging{
  cursor:grabbing;
}

.map-zoom-image{
  position:absolute;
  top:50%;
  left:50%;
  max-width:none;
  width:auto;
  height:auto;
  user-select:none;
  -webkit-user-drag:none;
  transform:translate(-50%, -50%) scale(1);
  transform-origin:center center;
}

.map-help{
  margin:0;
  color:var(--muted);
  font-size:.92rem;
}

.systems-map-page{
  min-height:100vh;
  background:#f8f7f3;
}

.systems-map-shell{
  min-height:100vh;
  display:flex;
  flex-direction:column;
}

.systems-map-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  padding:18px 28px;
  border-bottom:1px solid rgba(23,20,17,.08);
  background:rgba(248,247,243,.92);
  backdrop-filter:blur(8px);
}

.systems-map-header h1{
  margin:0;
  font-size:1rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--ink-soft);
}

.systems-map-actions{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}

.systems-map-main{
  flex:1;
  padding:22px 28px 28px;
}

.systems-map-main .map-viewport{
  height:calc(100vh - 132px);
}

.archive-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}

.archive-card{
  padding:24px;
  border-radius:16px;
  background:rgba(255,255,255,.9);
  display:flex;
  flex-direction:column;
  gap:12px;
  box-shadow:var(--shadow);
  transition:transform .26s ease, box-shadow .26s ease, border-color .26s ease, background .26s ease;
}

.archive-card.visual{
  overflow:hidden;
  padding:0 0 22px;
}

.archive-card:hover{
  transform:translateY(-7px) scale(1.012);
  box-shadow:0 26px 44px rgba(23,20,17,.12);
}

.archive-card.visual img,
.archive-art{
  width:100%;
  height:210px;
  object-fit:cover;
  transition:transform .48s ease;
}

.archive-card.visual:hover img,
.archive-card.visual:hover .archive-art{
  transform:scale(1.04);
}

.archive-card.visual img.fit-contain{
  object-fit:contain;
  background:#ffffff;
}


.archive-card.visual .meta,
.writing-card .meta{
  color:var(--sage);
  padding:0 22px;
  margin-top:4px;
}

.archive-card.visual strong,
.archive-card.visual p,
.archive-card.visual .archive-link{
  padding:0 22px;
}

.archive-card strong{
  font-size:1.2rem;
}

.archive-card p,
.writing-card p,
.timeline-card p,
.case-section p,
.deliverable-card p{
  color:var(--muted);
  font-size:.95rem;
}

.archive-link,
.text-link{
  margin-top:auto;
  font-size:.76rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sage);
}

.archive-art{
  background:#e6ddd0;
}

.art-thinking{
  background:
    radial-gradient(circle at 24% 20%, rgba(105,157,175,.22), transparent 22%),
    radial-gradient(circle at 76% 76%, rgba(95,123,98,.18), transparent 24%),
    linear-gradient(180deg,#eef5f4,#d9e6e2);
}

.art-cms{
  background:
    radial-gradient(circle at 22% 22%, rgba(95,123,98,.18), transparent 18%),
    linear-gradient(135deg,#f5f1ea,#d8dfda);
}

.art-sustainability{
  background:
    radial-gradient(circle at 78% 22%, rgba(95,123,98,.16), transparent 20%),
    linear-gradient(135deg,#e4ecdf,#f5f1e8);
}

.art-experience{
  background:
    radial-gradient(circle at 65% 30%, rgba(180,138,69,.18), transparent 20%),
    linear-gradient(135deg,#efe1d0,#d3c0af);
}

.art-photography{
  background:
    radial-gradient(circle at 50% 50%, rgba(191,92,58,.16), transparent 18%),
    linear-gradient(135deg,#efe2d6,#d8c4b7);
}

.art-internship{
  background:
    linear-gradient(90deg, rgba(23,20,17,.12) 33%, transparent 33%, transparent 66%, rgba(23,20,17,.12) 66%),
    linear-gradient(180deg,#f4efe6,#ded5c8);
}

.art-guardian{
  background:
    radial-gradient(circle at 22% 24%, rgba(255,255,255,.18), transparent 18%),
    radial-gradient(circle at 78% 72%, rgba(255,255,255,.12), transparent 16%),
    linear-gradient(135deg,#6e7264,#3f4639 42%, #b4a689 82%);
}

.page-hero{
  padding:72px 0 58px;
  position:relative;
  overflow:hidden;
}

.page-hero-main{
  display:grid;
  gap:14px;
}

.page-hero-tight h1{
  max-width:15ch;
}

.page-hero .container{
  display:grid;
  grid-template-columns:1.2fr .8fr;
  gap:56px;
  align-items:center;
}

.page-hero-main{
  position:relative;
  z-index:1;
}

.page-hero-side{
  position:relative;
  z-index:1;
  align-self:center;
  max-width:34rem;
  padding-right:3.5rem;
}

.page-hero-side .lede{
  color:rgba(244,240,233,.66);
  max-width:30rem;
  line-height:1.9;
}

.page-hero::before,
.page-hero::after{
  content:"";
  position:relative;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.08);
  position:absolute;
  pointer-events:none;
}

.page-hero::before{
  width:420px;
  height:420px;
  right:160px;
  top:34px;
}

.page-hero::after{
  width:240px;
  height:240px;
  right:68px;
  top:122px;
}

.work-page .page-hero{
  background:
    radial-gradient(circle at 78% 30%, rgba(95,123,98,.15), transparent 20%),
    linear-gradient(180deg,#171411,#201b17 100%);
}

.writing-page .page-hero{
  background:linear-gradient(180deg,#181411,#231c17 100%);
}

.about-page .page-hero{
  background:linear-gradient(180deg,#181411,#201b18 100%);
}

.timeline-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:32px;
}

.roadmap-grid{
  align-items:start;
}

.timeline-card{
  padding:30px;
  border-radius:18px;
  background:rgba(255,255,255,.88);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  display:flex;
  flex-direction:column;
}

.roadmap-card h2{
  margin:12px 0 20px;
  font-size:clamp(1.8rem, 2.6vw, 2.35rem);
  line-height:1.08;
  max-width:14ch;
}

.experience-list{
  display:grid;
  gap:14px;
}

.experience-item{
  padding:16px 18px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.96), rgba(247,249,246,.92));
  border:1px solid rgba(86,108,84,.1);
  box-shadow:0 12px 28px rgba(20,18,16,.04);
}

.experience-item.current{
  background:linear-gradient(180deg, rgba(245,249,246,.98), rgba(239,246,241,.95));
  border-color:rgba(86,108,84,.16);
}

.experience-meta{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  margin-bottom:8px;
}

.experience-meta time,
.experience-meta span{
  display:block;
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.experience-meta time{
  color:var(--gold);
}

.experience-meta span{
  color:var(--sage);
}

.experience-item strong{
  display:block;
  margin-bottom:5px;
  font-size:1.04rem;
  line-height:1.34;
}

.experience-item > span{
  display:block;
  margin-bottom:9px;
  color:var(--sage);
  font-size:.78rem;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.experience-item p{
  margin:0;
  color:var(--muted);
  line-height:1.58;
}

.foundation-card{
  display:grid;
  gap:18px;
}

.foundation-card h2{
  margin:4px 0 0;
  font-size:clamp(1.55rem, 2.2vw, 1.95rem);
  line-height:1.14;
  max-width:16ch;
}

.foundation-intro{
  padding:16px 18px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(245,247,255,.88), rgba(255,255,255,.72));
  border:1px solid rgba(139,166,199,.18);
}

.foundation-intro p{
  margin:0;
  color:var(--muted);
  line-height:1.62;
}

.foundation-stack{
  display:grid;
  gap:12px;
}

.foundation-item{
  padding:16px 18px;
  border-radius:18px;
  background:rgba(255,255,255,.72);
  border:1px solid var(--line);
}

.foundation-item time{
  display:block;
  margin-bottom:8px;
  color:var(--gold);
  font-size:.72rem;
  letter-spacing:.16em;
  text-transform:uppercase;
}

.foundation-item strong{
  display:block;
  margin-bottom:5px;
  font-size:1.04rem;
  line-height:1.36;
}

.foundation-item span{
  display:block;
  margin-bottom:8px;
  color:var(--sage);
  font-size:.8rem;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.foundation-item p{
  margin:0;
}

.timeline-list{
  display:grid;
  gap:18px;
  margin-top:18px;
}

.timeline-summary{
  margin-top:4px;
  padding:18px 20px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,251,244,.9), rgba(255,255,255,.82));
  border:1px solid rgba(180,138,69,.14);
  display:grid;
  gap:12px;
}

.timeline-summary h3{
  font-size:1.18rem;
  line-height:1.32;
  max-width:28ch;
}

.timeline-summary-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.timeline-summary-tags span{
  padding:9px 13px;
  border-radius:999px;
  background:rgba(244,238,229,.92);
  border:1px solid var(--line);
  color:var(--muted);
  font-size:.8rem;
}

.timeline-item{
  padding-left:18px;
  border-left:1px solid var(--line-strong);
}

.timeline-item time{
  display:block;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--gold);
  margin-bottom:6px;
}

.timeline-item strong{
  display:block;
  font-size:1.03rem;
  margin-bottom:2px;
}

.timeline-item span{
  display:block;
  font-size:.76rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--sage);
  margin-bottom:8px;
}

.milestone-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
  margin-top:20px;
}

.milestone-card{
  margin:0;
  padding:14px;
  border-radius:18px;
  background:rgba(255,255,255,.84);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
  display:grid;
  gap:14px;
}

.milestone-card img{
  width:100%;
  aspect-ratio:4 / 5;
  object-fit:cover;
  border-radius:14px;
  display:block;
}

.milestone-card figcaption{
  display:grid;
  gap:6px;
}

.milestone-card figcaption strong{
  font-size:1rem;
}

.milestone-card figcaption span{
  color:var(--muted);
  line-height:1.62;
}

.personal-strip{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:22px;
  margin-top:22px;
  align-items:start;
}

.personal-column{
  display:grid;
  gap:12px;
  align-content:start;
  padding:0;
  border-radius:0;
  background:transparent;
  border:none;
  box-shadow:none;
  transition:transform .24s ease;
}

.personal-column:hover,
.personal-column.is-active{
  transform:translateY(-2px);
}

.personal-carousel{
  position:relative;
  min-height:452px;
  padding:18px 18px 70px;
  border-radius:10px;
  overflow:hidden;
  background:linear-gradient(180deg,#fffefc,#fbfaf6);
  border:1px solid rgba(84,71,56,.08);
  box-shadow:0 18px 30px rgba(23,20,17,.06);
  transform:rotate(-1deg);
}

.personal-column:nth-child(1) .personal-carousel{
  background:linear-gradient(180deg,#fffdf6,#fbf6df);
}

.personal-column:nth-child(2) .personal-carousel{
  background:linear-gradient(180deg,#fffdfd,#fbeff1);
  transform:rotate(.85deg);
}

.personal-column:nth-child(3) .personal-carousel{
  background:linear-gradient(180deg,#fbfdff,#edf4ff);
  transform:rotate(-.6deg);
}

.personal-carousel::before,
.personal-carousel::after{
  content:"";
  position:absolute;
  inset:10px;
  border-radius:8px;
  background:#fffdf8;
  border:1px solid rgba(84,71,56,.05);
  z-index:0;
}

.personal-column:nth-child(1) .personal-carousel::before,
.personal-column:nth-child(1) .personal-carousel::after{
  background:#fff9e7;
}

.personal-column:nth-child(2) .personal-carousel::before,
.personal-column:nth-child(2) .personal-carousel::after{
  background:#fff4f6;
}

.personal-column:nth-child(3) .personal-carousel::before,
.personal-column:nth-child(3) .personal-carousel::after{
  background:#f4f8ff;
}

.personal-carousel::before{
  transform:translate(8px, 10px) rotate(2deg);
  opacity:.7;
}

.personal-carousel::after{
  transform:translate(-6px, 6px) rotate(-2deg);
  opacity:.55;
}

.personal-slide{
  position:absolute;
  inset:18px 18px 72px 18px;
  opacity:0;
  transform:scale(1.02);
  transition:opacity .55s ease, transform .7s ease;
  z-index:1;
}

.personal-slide.is-active{
  opacity:1;
  transform:scale(1);
}

.personal-slide img{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  display:block;
  filter:saturate(.97) contrast(1.01);
  border-radius:4px;
}

.personal-slide img.focus-top{
  object-position:center 22%;
}

.personal-slide img.focus-bottom{
  object-position:center 82%;
}

.personal-frame-label{
  position:absolute;
  left:20px;
  right:20px;
  bottom:18px;
  z-index:2;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding-top:14px;
  border-top:1px solid rgba(84,71,56,.1);
  font-family:var(--display);
  font-size:1rem;
  letter-spacing:.01em;
  color:#5f4f3d;
}

.personal-frame-label::after{
  content:attr(data-note);
  font-family:var(--text);
  font-size:.68rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:rgba(95,79,61,.62);
}

.personal-copy{
  display:grid;
  gap:7px;
  padding:2px 4px 0;
}

.personal-copy strong{
  font-size:1.04rem;
  line-height:1.36;
  font-family:var(--display);
  font-weight:500;
  letter-spacing:-.01em;
}

.personal-copy span{
  color:var(--muted);
  line-height:1.66;
  max-width:32ch;
}

.personal-dots{
  display:flex;
  gap:8px;
  padding-left:4px;
  margin-top:-4px;
}

.personal-dots span{
  width:8px;
  height:8px;
  border-radius:50%;
  background:rgba(23,20,17,.14);
  cursor:pointer;
  transition:transform .22s ease, background .22s ease;
}

.personal-dots span.is-active{
  background:#8ba6c7;
  transform:scale(1.15);
}

.personal-column:nth-child(2) .personal-dots span.is-active{
  background:#d08c9e;
}

.personal-column:nth-child(3) .personal-dots span.is-active{
  background:#8ba6c7;
}

.writing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  gap:16px;
  background:transparent;
}

.writing-card{
  min-height:240px;
  padding:28px;
  border-radius:22px;
  background:#fffefb;
  display:flex;
  flex-direction:column;
  gap:12px;
  border:1px dashed rgba(95,123,98,.14);
  box-shadow:0 16px 34px rgba(23,20,17,.04);
  transition:transform .26s ease, box-shadow .26s ease, background .26s ease, border-color .26s ease;
}

.writing-card:hover{
  transform:translateY(-6px);
  box-shadow:0 24px 40px rgba(23,20,17,.08);
  border-color:rgba(95,123,98,.26);
}

.writing-card.highlight{
  background:#eef3ee;
}

.writing-icon{
  width:44px;
  height:44px;
  border-radius:12px;
  display:grid;
  place-items:center;
  background:var(--sage-soft);
  color:var(--sage);
  font-size:1.08rem;
}

.contact-band{
  display:grid;
  grid-template-columns:minmax(0,1fr);
  gap:24px;
}

.contact-card{
  padding:30px;
  border-radius:18px;
  background:var(--paper);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}

.contact-card h2{
  font-size:clamp(1.72rem,2.12vw,2.16rem);
  line-height:1.05;
  letter-spacing:-0.02em;
  max-width:20ch;
  text-wrap:balance;
}

.contact-card .lede{
  max-width:31rem;
}

.contact-list{
  display:grid;
  gap:12px;
}

.contact-item{
  padding:16px 0;
  border-bottom:1px solid var(--line);
  transition:transform .22s ease, padding-left .22s ease;
}

.contact-item:last-child{
  border-bottom:none;
}

.contact-item:hover{
  transform:translateX(4px);
  padding-left:4px;
}

.contact-item span{
  display:block;
  margin-bottom:4px;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}

.contact-letter{
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}

.contact-bouquet{
  display:grid;
  gap:18px;
}

.contact-bouquet-header{
  display:grid;
  gap:8px;
}

.contact-letter-label{
  display:inline-flex;
  align-items:center;
  gap:12px;
  width:max-content;
  font-size:.75rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#4A7B5A;
}

.contact-letter-label::after{
  content:"";
  width:64px;
  height:1px;
  background:rgba(74,123,90,.34);
}

.contact-bouquet-header h3{
  margin:0;
  font-family:var(--display);
  font-size:clamp(1.58rem, 2.2vw, 2rem);
  line-height:1.02;
  color:#2C2C2A;
}

.contact-bouquet-header p{
  margin:0;
  max-width:36rem;
  font-size:13px;
  line-height:1.7;
  color:rgba(78,74,68,.74);
}

.bouquet-chip-row{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.bouquet-chip{
  padding:9px 15px;
  border-radius:999px;
  border:1px solid rgba(44,44,42,.12);
  background:transparent;
  color:rgba(78,74,68,.82);
  font-size:13px;
  line-height:1;
  transition:all .25s ease;
}

.bouquet-chip:hover,
.bouquet-chip:focus-visible{
  border-color:color-mix(in srgb, var(--chip-color) 55%, rgba(44,44,42,.1));
  color:#2C2C2A;
  transform:translateY(-1px);
}

.bouquet-chip.is-active{
  background:color-mix(in srgb, var(--chip-color) 16%, transparent);
  border-color:var(--chip-color);
  color:#2C2C2A;
}

.contact-letter-sheet{
  display:grid;
  gap:12px;
}

.contact-bouquet-card{
  background:#F0EDE6;
  border:.5px solid rgba(0,0,0,.09);
  border-radius:16px;
  padding:1.6rem;
  overflow:hidden;
}

.bouquet-stage{
  display:grid;
  grid-template-columns:200px minmax(0, 720px);
  justify-content:space-between;
  gap:28px;
  align-items:center;
}

.bouquet-vase-column{
  display:grid;
  justify-items:center;
  gap:10px;
}

.bouquet-vase-wrap{
  width:100%;
  max-width:168px;
  display:flex;
  justify-content:center;
  align-items:flex-end;
  padding-top:0;
}

.bouquet-vase-svg{
  width:100%;
  height:auto;
  display:block;
  overflow:visible;
}

.bouquet-vase-note{
  margin:0;
  max-width:110px;
  font-size:11px;
  line-height:1.5;
  text-align:center;
  color:#999;
}

.bouquet-note-card{
  background:#FFFEF9;
  border-radius:10px;
  border:.5px solid rgba(0,0,0,.07);
  padding:1.15rem 1.3rem 1rem;
  position:relative;
}

.bouquet-note-rule{
  height:1px;
  background:rgba(200,184,154,.75);
  margin-bottom:14px;
}

.bouquet-note-body{
  display:grid;
  gap:8px;
  font-family:Georgia, "Times New Roman", serif;
  font-size:15px;
  line-height:1.95;
  color:#2C2C2A;
  max-width:34rem;
}

.bouquet-note-body p{
  margin:0;
}

.bouquet-letter-line{
  display:block;
  font-size:15px;
  line-height:1.95;
}

.bouquet-letter-line > span,
.bouquet-letter-line .bouquet-topic-slot,
.bouquet-letter-line .bouquet-inline-input,
.bouquet-letter-line .bouquet-generated-line{
  display:inline-block;
  vertical-align:baseline;
  margin-right:6px;
  margin-bottom:4px;
}

.bouquet-inline-input,
.bouquet-generated-line{
  font-family:inherit;
  font-size:inherit;
  line-height:inherit;
  color:#2C2C2A;
  background:transparent;
  border:none;
  border-bottom:1px solid #c8b89a;
  outline:none;
  padding:0 .06rem .08rem;
  min-height:1.5em;
  display:inline-block;
  vertical-align:baseline;
  transition:border-color .2s ease, color .2s ease;
  border-radius:0;
}

.bouquet-inline-input{
  min-width:100px;
}

.bouquet-inline-input-name{
  min-width:110px;
}

.bouquet-inline-input[data-bouquet-source]{
  min-width:155px;
}

.bouquet-inline-input[data-bouquet-chat]{
  min-width:180px;
}

.bouquet-inline-input[data-bouquet-help-input]{
  min-width:160px;
}

.bouquet-inline-input::placeholder{
  color:#bbb;
}

.bouquet-inline-input:focus{
  border-bottom-color:var(--bouquet-focus, #4A7B5A);
}

.bouquet-topic-slot{
  display:inline-flex;
  align-items:flex-end;
  min-width:120px;
}

.bouquet-topic-display{
  min-width:120px;
  color:#6a655d;
}

.bouquet-topic-display.is-active{
  color:#2C2C2A;
}

.bouquet-topic-input{
  min-width:120px;
}

.bouquet-soft-hint{
  min-height:1.1em;
  margin:8px 0 0;
  font-size:12px;
  color:#8f6f64;
}

.bouquet-soft-hint.is-visible{
  color:#E8504A;
}

.bouquet-note-footer{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-end;
  justify-content:space-between;
  gap:14px 18px;
  margin-top:14px;
  padding-top:14px;
  border-top:.5px solid rgba(0,0,0,.08);
}

.bouquet-note-actions{
  margin-top:0;
}

.bouquet-send{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 24px;
  border:none;
  border-radius:999px;
  background:#2C2C2A;
  color:#F7F4EF;
  font-size:13px;
  letter-spacing:.02em;
  transition:background .2s ease, transform .2s ease, box-shadow .2s ease;
}

.bouquet-send:hover,
.bouquet-send:focus-visible{
  background:var(--green-deep);
  transform:translateY(-1px);
  box-shadow:0 10px 20px rgba(23,20,17,.10);
}

.bouquet-send-check{
  opacity:0;
  transform:scale(.75);
  transition:opacity .18s ease, transform .18s ease;
}

.bouquet-send.is-sent{
  background:var(--green-deep);
}

.bouquet-send.is-sent .bouquet-send-check{
  opacity:1;
  transform:scale(1);
}

.bouquet-direct{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:8px 10px;
  font-size:11px;
  color:rgba(78,74,68,.72);
  padding-left:0;
  margin-left:auto;
}

.bouquet-direct a{
  color:#4A7B5A;
  text-decoration:underline;
  text-underline-offset:3px;
}

.bouquet-icons{
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:8px;
}

.bouquet-icons a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:20px;
  height:20px;
  color:#888;
  text-decoration:none;
}

.bouquet-icons svg{
  width:16px;
  height:16px;
  fill:currentColor;
}

.bouquet-stem-group{
  transform-origin:bottom center;
}

.bouquet-stem-line{
  fill:none;
  stroke:#2D6B45;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round;
  transform-origin:bottom center;
  animation:stem-grow .6s ease-out forwards, flower-sway 3s ease-in-out infinite alternate 1.1s;
}

.bouquet-leaf{
  fill:#29A870;
  transform-box:fill-box;
  transform-origin:center;
  opacity:0;
  animation:petal-bloom .3s ease-out forwards, flower-sway 4s ease-in-out infinite alternate 1s;
}

.bouquet-flower-part{
  opacity:0;
  transform-box:fill-box;
  transform-origin:center;
  animation:petal-bloom .3s ease-out forwards;
}

.contact-bouquet-card:hover .bouquet-stem-group{
  animation:flower-bob .7s ease;
}

.bouquet-stem-underwater{
  opacity:.4;
}

.bouquet-vase-outline{
  opacity:.96;
}

.bouquet-head-group{
  transform-origin:center 120px;
  animation:flower-sway 3s ease-in-out infinite alternate 1.1s;
}

.bouquet-head-group ellipse,
.bouquet-head-group path,
.bouquet-head-group circle{
  vector-effect:non-scaling-stroke;
}

.bouquet-head-group.is-removing{
  animation:flower-hide .3s ease forwards;
}

.bouquet-stem-group.is-removing{
  animation:stem-hide .4s ease forwards;
}

@keyframes stem-grow{
  from{ transform:scaleY(0); }
  to{ transform:scaleY(1); }
}

@keyframes petal-bloom{
  from{
    opacity:0;
    transform:scale(0);
  }
  to{
    opacity:1;
    transform:scale(1);
  }
}

@keyframes flower-sway{
  from{ transform:rotate(-1.5deg); }
  to{ transform:rotate(1.5deg); }
}

@keyframes flower-bob{
  0%, 100%{ transform:translateY(0); }
  50%{ transform:translateY(-4px); }
}

@keyframes stem-hide{
  from{ transform:scaleY(1); opacity:1; }
  to{ transform:scaleY(0); opacity:0; }
}

@keyframes flower-hide{
  from{ transform:scale(1); opacity:1; }
  to{ transform:scale(0); opacity:0; }
}

@media (max-width: 900px){
  .contact-bouquet-card{
    padding:1.4rem;
  }

  .bouquet-stage{
    grid-template-columns:1fr;
    justify-content:stretch;
    gap:22px;
  }

  .bouquet-vase-column{
    order:1;
  }

  .bouquet-note-card{
    order:2;
  }

  .bouquet-direct{
    align-items:flex-start;
    justify-content:flex-start;
    margin-left:0;
  }

  .bouquet-note-body{
    max-width:none;
  }

  .bouquet-note-footer{
    align-items:flex-start;
    justify-content:flex-start;
  }
}

@media (max-width: 640px){
  .bouquet-chip-row{
    gap:8px;
  }

  .bouquet-chip{
    padding:8px 12px;
  }

  .bouquet-note-card{
    padding:1rem;
  }

  .bouquet-letter-line{
    line-height:2;
  }

  .bouquet-direct{
    flex-direction:column;
    align-items:flex-start;
  }

  .bouquet-icons{
    margin-left:0;
  }

  .bouquet-stage{
    gap:24px;
  }

  .bouquet-vase-column{
    justify-self:center;
  }
}

.project-page{
  min-height:70vh;
}

.case-hero{
  padding:68px 0 40px;
}

.case-hero-grid{
  display:grid;
  grid-template-columns:1fr .92fr;
  gap:34px;
  align-items:end;
}

.case-copy{
  display:flex;
  flex-direction:column;
  gap:18px;
}

.back-link{
  display:inline-flex;
  width:max-content;
  padding:8px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.7);
  border:1px solid var(--line);
  color:var(--muted);
  font-size:.76rem;
  letter-spacing:.08em;
  text-transform:uppercase;
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease;
}

.back-link:hover{
  transform:translateY(-2px);
  background:#fff;
  color:var(--ink);
  box-shadow:0 12px 24px rgba(23,20,17,.08);
}

.case-media{
  aspect-ratio:4 / 3;
  min-height:0;
  border-radius:18px;
  overflow:hidden;
  box-shadow:var(--shadow);
  background:linear-gradient(135deg,#e8dece,#cec0b4);
}

.case-media img,
.case-hero-art{
  width:100%;
  height:100%;
  object-fit:cover;
}

.case-media img.fit-contain{
  object-fit:contain;
  background:#ffffff;
}

.case-hero-art.fallback{
  display:grid;
  place-items:end start;
  padding:28px;
  background:
    radial-gradient(circle at 18% 24%, rgba(255,255,255,.24), transparent 18%),
    linear-gradient(135deg,#d7c5b4,#8f7467 42%, #efe2d5 78%);
}

.case-hero-art.fallback span{
  font-family:var(--display);
  font-size:2.3rem;
  color:#fff;
}

.case-layout{
  display:grid;
  grid-template-columns:1fr;
}

.case-main{
  display:grid;
  gap:26px;
}

.case-summary{
  display:grid;
  gap:14px;
  padding:20px 24px;
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(252,248,241,.92));
  border:1px solid rgba(23,20,17,.08);
  box-shadow:0 12px 28px rgba(37,28,22,.04);
}

.case-summary-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px 22px;
}

.case-summary-item{
  display:grid;
  gap:6px;
  align-content:start;
}

.case-summary-item-wide{
  grid-column:1 / -1;
}

.case-summary-label{
  font-size:.74rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--page-accent, var(--sage));
}

.case-summary-item p{
  margin:0;
  color:var(--ink);
  font-size:.94rem;
  line-height:1.66;
}

.case-story-intro{
  display:grid;
  gap:16px;
  position:relative;
  padding:8px 0 2px;
}

.case-story-column{
  display:grid;
  gap:14px;
  padding:0;
}

.case-story-column h2{
  max-width:15ch;
  color:#355a45;
}

.case-story-prose{
  display:grid;
  gap:14px;
  position:relative;
}

.case-story-prose p{
  max-width:68ch;
  color:var(--muted);
  font-size:1rem;
  line-height:1.82;
}

.case-story-prose p:first-child::first-letter{
  float:left;
  margin:.08em .14em 0 0;
  font-family:var(--display);
  font-size:3.7rem;
  line-height:.78;
  color:var(--gold);
}

.case-flow{
  display:grid;
  gap:16px;
  padding:2px 0 10px;
}

.case-flow-track{
  display:grid;
  grid-template-columns:repeat(4, minmax(0, 1fr));
  gap:14px;
  position:relative;
}

.case-flow-track::before{
  content:"";
  position:absolute;
  left:8%;
  right:8%;
  top:28px;
  height:1px;
  background:linear-gradient(90deg, rgba(95,123,98,.12), rgba(180,138,69,.22), rgba(139,166,199,.14));
  z-index:0;
}

.case-flow-step{
  position:relative;
  z-index:1;
  display:grid;
  gap:10px;
  padding:16px 18px 18px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.92), rgba(252,248,241,.92));
  border:1px solid rgba(23,20,17,.08);
  box-shadow:0 12px 24px rgba(37,28,22,.04);
}

.case-flow-step:nth-child(2n){
  transform:translateY(18px);
}

.case-flow-step:nth-child(3n){
  background:linear-gradient(180deg, rgba(248,250,247,.96), rgba(255,255,255,.92));
}

.case-flow-step:nth-child(4n){
  background:linear-gradient(180deg, rgba(248,245,239,.96), rgba(255,255,255,.92));
}

.case-flow-number{
  width:40px;
  height:40px;
  display:grid;
  place-items:center;
  border-radius:50%;
  background:#fff;
  border:1px solid rgba(23,20,17,.08);
  box-shadow:0 10px 20px rgba(37,28,22,.05);
  font-size:.76rem;
  letter-spacing:.12em;
  text-transform:uppercase;
  color:var(--page-accent, var(--gold));
}

.case-flow-step strong{
  max-width:16ch;
  font-size:.96rem;
  line-height:1.4;
  color:#2b4938;
}

.case-flow-step::after{
  position:absolute;
  right:16px;
  top:14px;
  font-size:.95rem;
  color:rgba(95,123,98,.28);
}

.case-flow-step:nth-child(1)::after{ content:"◌"; }
.case-flow-step:nth-child(2)::after{ content:"✦"; }
.case-flow-step:nth-child(3)::after{ content:"✲"; }
.case-flow-step:nth-child(4)::after{ content:"↗"; }

.case-glance-list{
  margin:0;
  padding:0;
  list-style:none;
  display:grid;
  gap:12px;
}

.case-glance-list li{
  position:relative;
  padding-left:20px;
  color:var(--muted);
  line-height:1.7;
  max-width:34ch;
}

.case-glance-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:.62em;
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--page-accent, var(--sage));
  box-shadow:0 0 0 5px rgba(95,123,98,.08);
}

.case-outcome{
  margin:14px 0 0;
  max-width:52ch;
  color:var(--ink);
  font-size:.98rem;
  line-height:1.6;
}

.case-outcome span{
  font-weight:700;
  color:var(--page-accent, var(--sage));
}

.case-section{
  display:grid;
  gap:16px;
}

.case-process-section{
  gap:18px;
}

.case-story-block{
  display:grid;
  grid-template-columns:84px minmax(0,1fr);
  gap:18px;
  align-items:start;
  padding:14px 0 2px;
  position:relative;
}

.case-story-label{
  font-family:var(--display);
  font-size:2rem;
  line-height:1;
  color:rgba(53,90,69,.62);
}

.case-story-copy{
  display:grid;
  gap:10px;
  padding:18px 22px;
  border-radius:20px;
  background:linear-gradient(180deg, rgba(255,255,255,.78), rgba(248,244,237,.76));
  border:1px solid rgba(23,20,17,.06);
  box-shadow:0 12px 24px rgba(37,28,22,.04);
}

.case-story-copy p{
  max-width:70ch;
  color:var(--muted);
  line-height:1.78;
}

.case-story-copy h2{
  color:#284c72;
}

.case-card-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}

.case-card,
.deliverable-card{
  padding:22px;
  border-radius:14px;
  background:rgba(255,255,255,.88);
  border:1px solid var(--line);
  box-shadow:0 14px 28px rgba(37,28,22,.05);
  position:relative;
  overflow:hidden;
  transition:transform .26s ease, box-shadow .26s ease, border-color .26s ease;
}

.case-card:hover,
.deliverable-card:hover{
  transform:translateY(-5px);
  box-shadow:0 22px 34px rgba(37,28,22,.09);
  border-color:rgba(23,20,17,.11);
}

.case-card:nth-child(3n + 1),
.deliverable-card:nth-child(3n + 1){
  background:linear-gradient(180deg, rgba(238,245,238,.92), rgba(255,255,255,.94));
}

.case-card:nth-child(3n + 2),
.deliverable-card:nth-child(3n + 2){
  background:linear-gradient(180deg, rgba(248,242,233,.94), rgba(255,255,255,.94));
}

.case-card:nth-child(3n),
.deliverable-card:nth-child(3n){
  background:linear-gradient(180deg, rgba(239,243,249,.94), rgba(255,255,255,.94));
}

.case-card::after,
.deliverable-card::after{
  content:"";
  position:absolute;
  right:14px;
  top:14px;
  width:10px;
  height:10px;
  border-radius:50%;
  background:rgba(23,20,17,.08);
}

.case-card h4,
.deliverable-card h4{
  margin-bottom:10px;
  font-family:var(--text);
  font-size:1rem;
  font-weight:700;
  color:#2b4938;
}

.quote-band,
.lesson-band{
  padding:34px 38px;
  border-radius:8px;
}

.quote-band{
  background:
    radial-gradient(circle at 88% 18%, rgba(180,138,69,.10), transparent 20%),
    var(--paper);
  border-left:4px solid var(--gold);
  box-shadow:var(--shadow);
  position:relative;
}

.quote-band h3{
  color:#355a45;
}

.quote-band blockquote{
  margin:16px 0 0;
  font-family:var(--display);
  font-size:2rem;
  line-height:1.25;
}

.quote-band::after{
  content:"✧";
  position:absolute;
  right:24px;
  top:22px;
  color:rgba(180,138,69,.45);
  font-size:1.1rem;
}

.deliverable-grid{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:14px;
}

.lesson-band{
  background:linear-gradient(135deg,#181411,#27211d);
  color:#f7f2ea;
  border-radius:18px;
  position:relative;
}

.lesson-band h3{
  color:#d8c28c;
}

.lesson-band p{
  margin-top:12px;
  color:rgba(247,242,234,.78);
  font-size:1rem;
}

.lesson-band::before{
  content:"";
  position:absolute;
  right:22px;
  top:20px;
  width:42px;
  height:42px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.12);
}

.case-actions{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
}

.footer{
  padding:22px 0 28px;
  border-top:1px solid var(--line);
  background:rgba(252,250,246,.92);
}

.footer .container{
  display:flex;
  justify-content:space-between;
  gap:20px;
  flex-wrap:wrap;
  color:var(--muted);
  font-size:.88rem;
}

.skills-board{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:0;
  border:1px solid rgba(23,20,17,.12);
  background:#fffefb;
  box-shadow:0 20px 40px rgba(23,20,17,.04);
}

.skills-panel{
  min-width:0;
  padding:26px 32px 32px;
  border-right:1px solid rgba(23,20,17,.12);
}

.skills-panel:last-child{
  border-right:none;
}

.skills-panel-head{
  padding-bottom:18px;
  margin-bottom:22px;
  border-bottom:1px solid rgba(23,20,17,.12);
}

.skills-panel-kicker{
  display:inline-block;
  font-size:.92rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--sage);
}

.skills-chip-grid{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
}

.skills-chip-grid span{
  display:inline-flex;
  align-items:center;
  padding:12px 16px;
  background:#e8f0e8;
  color:#6e7f6a;
  font-size:.9rem;
  line-height:1.2;
  letter-spacing:.02em;
  text-transform:uppercase;
  border-radius:0;
  transition:transform .2s ease, box-shadow .2s ease;
}

.skills-chip-grid span:hover{
  transform:translateY(-2px);
  box-shadow:0 8px 16px rgba(23,20,17,.06);
}

.writing-page .section-dark{
  background:#181411;
}

.writing-page .page-hero{
  padding:62px 0 42px;
}

.writing-page .page-hero h1{
  font-size:clamp(2.8rem,4.6vw,4.6rem);
  max-width:760px;
}

.writing-page .page-hero .container{
  align-items:start;
}

.writing-page .writing-card strong{
  font-size:1.12rem;
  line-height:1.35;
  font-family:var(--display);
  font-weight:400;
}

.writing-page .writing-clean{
  background:
    radial-gradient(circle at 12% 16%, rgba(195,146,114,.05), transparent 18%),
    radial-gradient(circle at 88% 82%, rgba(95,123,98,.05), transparent 18%),
    linear-gradient(180deg,#fffefa,#f9f8f4);
}

.writing-page .writing-card:nth-child(1){background:#fffdf9}
.writing-page .writing-card:nth-child(2){background:#f6fbf5}
.writing-page .writing-card:nth-child(3){background:#fff8f1}
.writing-page .writing-card:nth-child(4){background:#fbfdf8}
.writing-page .writing-card:nth-child(5){background:#fdfaf2}
.writing-page .writing-card:nth-child(6){background:#f6f8fd}
.writing-page .writing-card:nth-child(7){background:#fdfbf6}

.about-page .page-hero h1,
.work-page .page-hero h1{
  font-size:clamp(2.8rem,4.4vw,4.6rem);
}

.home-page .section-head h2,
.home-page .clean-board-head h2,
.about-page .clean-board-head h2{
  font-size:clamp(2rem,3.5vw,3.2rem);
}

.about-intro-band{
  background:
    radial-gradient(circle at 14% 20%, rgba(139,166,199,.12), transparent 18%),
    linear-gradient(180deg,#f7faff,#eef3f9);
}

.about-intro-grid{
  display:grid;
  grid-template-columns:.78fr 1.22fr;
  gap:24px;
  align-items:center;
}

.about-photo{
  padding:18px;
  border-radius:26px;
  background:linear-gradient(180deg,#fffefb,#f7f8f5);
  box-shadow:var(--shadow);
  overflow:hidden;
}

.about-photo img{
  width:100%;
  aspect-ratio:4 / 5;
  object-fit:cover;
  object-position:center 24%;
  border-radius:18px;
  display:block;
}

.about-intro-copy{
  display:grid;
  gap:14px;
}

.about-intro-copy p:not(.lede){
  color:var(--muted);
  line-height:1.72;
}

.about-personal-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:4px;
}

.about-personal-tags span{
  padding:9px 14px;
  border-radius:999px;
  background:rgba(255,255,255,.84);
  border:1px solid var(--line);
  color:var(--muted);
  font-size:.82rem;
}

.contact-end-band{
  background:
    radial-gradient(circle at 78% 20%, rgba(195,146,114,.08), transparent 20%),
    linear-gradient(180deg,#ffffff,#faf9f5);
  position:relative;
  padding:46px 0 28px;
}

.contact-end-band::before{
  content:"";
  position:absolute;
  left:5%;
  bottom:12%;
  width:170px;
  height:170px;
  border-radius:50%;
  background:radial-gradient(circle, rgba(195,146,114,.12), transparent 68%);
  pointer-events:none;
}

.contact-home-grid{
  display:grid;
  grid-template-columns:1.08fr .92fr;
  gap:24px;
  align-items:start;
}

.contact-home-shell{
  display:grid;
  grid-template-columns:minmax(0,1.12fr) minmax(310px,.88fr);
  gap:28px;
  align-items:start;
  padding:20px 30px 24px;
  border-radius:24px;
  background:rgba(255,255,255,.78);
  border:1px solid rgba(23,20,17,.08);
  box-shadow:var(--shadow);
  position:relative;
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(circle at 18% 84%, rgba(171,191,220,.08), transparent 22%),
    rgba(255,255,255,.78);
}

.contact-home-copy,
.contact-home-card{
  min-width:0;
  position:relative;
  z-index:1;
}

.contact-home-copy-text{
  min-width:0;
}

.contact-home-copy h2{
  font-size:clamp(2.05rem,3.45vw,3.05rem);
  line-height:1.05;
  max-width:14ch;
  letter-spacing:-.04em;
  margin-bottom:12px;
}

.contact-home-copy .lede{
  max-width:29rem;
  font-size:1rem;
  line-height:1.62;
}

.contact-home-card{
  padding-left:8px;
  padding-top:4px;
}

.work-page .archive-grid{
  position:relative;
}

.work-filter-bar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:12px;
  margin:0 0 28px;
}

.work-filter-label{
  font-size:.76rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}

.work-filter-chip{
  min-height:40px;
  padding:0 18px;
  border:1px solid var(--line);
  background:#fffdf9;
  color:var(--muted);
  font:inherit;
  font-size:.78rem;
  letter-spacing:.1em;
  text-transform:uppercase;
  cursor:pointer;
  transition:transform .22s ease, background .22s ease, color .22s ease, border-color .22s ease, box-shadow .22s ease;
}

.work-filter-chip:hover{
  transform:translateY(-2px);
  background:#fff;
  color:var(--ink);
  box-shadow:0 12px 24px rgba(23,20,17,.07);
}

.work-filter-chip.is-active{
  background:#54786f;
  color:#fff;
  border-color:#54786f;
  box-shadow:0 14px 26px rgba(84,120,111,.18);
}

.work-page .archive-grid::before{
  content:"";
  position:absolute;
  left:-24px;
  top:-18px;
  width:150px;
  height:150px;
  background:
    linear-gradient(180deg, rgba(255,255,255,.7), rgba(255,255,255,.7)),
    url("./assets/snapshot-seed.jpg") center center / contain no-repeat;
  opacity:.12;
  pointer-events:none;
}

.about-page .skills-map,
.about-page .map-layout,
.work-page .archive-grid-visual,
.writing-page .writing-grid-rich{
  position:relative;
  z-index:1;
}

.archive-card.is-hidden{
  display:none;
}

.contact-tags{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:16px;
}

.contact-tags span{
  padding:9px 14px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--line);
  color:var(--muted);
  font-size:.82rem;
}

.contact-role-cvs{
  margin-top:22px;
  max-width:34rem;
}

.contact-role-cvs-label{
  display:block;
  margin-bottom:10px;
  font-size:.72rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:rgba(23,20,17,.54);
}

@media (hover: hover) and (pointer: fine){
  body.has-custom-cursor,
  body.has-custom-cursor a,
  body.has-custom-cursor button,
  body.has-custom-cursor .button,
  body.has-custom-cursor .featured-card,
  body.has-custom-cursor .archive-card,
  body.has-custom-cursor .writing-card,
  body.has-custom-cursor .proof-card,
  body.has-custom-cursor .snapshot-card,
  body.has-custom-cursor .personal-panel,
  body.has-custom-cursor .case-card,
  body.has-custom-cursor .deliverable-card,
  body.has-custom-cursor .work-filter-chip{
    cursor:none !important;
  }

  .custom-cursor{
    position:fixed;
    left:0;
    top:0;
    width:18px;
    height:18px;
    pointer-events:none;
    z-index:9999;
    opacity:.9;
    background:url("./assets/cursor-flower.png") center/contain no-repeat;
    transform:translate3d(-100px,-100px,0);
    transition:width .18s ease,height .18s ease,opacity .18s ease,filter .18s ease;
    filter:brightness(0) invert(1);
    mix-blend-mode:difference;
    will-change:transform;
  }

  .custom-cursor::after{
    content:"";
    position:absolute;
    inset:-8px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(95,123,98,.12), transparent 70%);
    opacity:0;
    transform:scale(.8);
    transition:opacity .18s ease, transform .18s ease;
  }

  .custom-cursor.is-active{
    width:24px;
    height:24px;
    opacity:1;
  }

  .custom-cursor.is-active::after{
    opacity:1;
    transform:scale(1);
  }

  .custom-cursor.is-pressed{
    width:20px;
    height:20px;
    opacity:.88;
    filter:brightness(0) invert(1);
  }

  .custom-cursor.is-pressed::after{
    opacity:.65;
    transform:scale(1.18);
  }

  .custom-cursor.is-hidden{
    opacity:0;
  }
}

@media (max-width: 1100px){
  .hero,
  .split,
  .story-grid,
  .map-layout,
  .timeline-grid,
  .contact-band,
  .about-intro-grid,
  .contact-home-grid,
  .snapshot-grid,
  .page-hero .container,
  .case-hero-grid,
  .skills-board{
    grid-template-columns:1fr;
  }

  .contact-band{
    gap:8px;
  }

  .contact-home-shell{
    grid-template-columns:1fr;
    gap:18px;
  }

  .contact-home-background::before{
    inset:26% 8% 18% 8%;
    background:
      radial-gradient(circle at 58% 50%, rgba(171,191,220,.07), transparent 34%),
      radial-gradient(circle at 42% 50%, rgba(93,123,101,.045), transparent 28%),
      url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='760' height='260' viewBox='0 0 760 260' fill='none'%3E%3Cg stroke='%23646E73' stroke-width='2.2' stroke-linecap='round' opacity='0.7'%3E%3Cpath d='M186 128c0-38-30-68-68-68s-68 30-68 68 30 68 68 68c22 0 42-10 55-27 10-13 13-34 3-47-8-11-26-14-37-6-11 8-14 24-7 35 6 10 20 14 30 9 9-4 14-16 10-25-3-8-12-12-20-10-8 2-13 11-10 19 3 7 11 11 18 9 6-2 10-8 9-15-1-6-7-10-13-10-6 0-11 5-11 11s5 10 10 10'/%3E%3Cpath d='M186 128c52 0 67-38 96-38 29 0 37 23 57 23'/%3E%3Cpath d='M525 128c0-44 36-80 80-80s80 36 80 80-36 80-80 80-80-36-80-80Z'/%3E%3Cpath d='M540 128c0-36 29-65 65-65s65 29 65 65-29 65-65 65-65-29-65-65Z'/%3E%3Cpath d='M555 128c0-28 22-50 50-50s50 22 50 50-22 50-50 50-50-22-50-50Z'/%3E%3Cpath d='M569 128c0-20 16-36 36-36s36 16 36 36-16 36-36 36-36-16-36-36Z'/%3E%3Cpath d='M581 128c0-13 11-24 24-24s24 11 24 24-11 24-24 24-24-11-24-24Z'/%3E%3Cpath d='M592 128c0-7 6-13 13-13s13 6 13 13-6 13-13 13-13-6-13-13Z'/%3E%3C/g%3E%3C/svg%3E") center/100% no-repeat;
    opacity:.44;
  }

  .contact-home-card{
    padding-left:0;
  }

  .contact-card + .contact-card{
    border-left:none;
    border-top:1px solid var(--line);
  }

  .hero-copy{
    width:auto;
    padding:52px 0 28px;
  }

  .hero-grid-text{
    grid-template-columns:1fr;
  }

  .hero-proof-points{
    max-width:none;
  }

  .hero-visual{
    position:relative;
    inset:auto;
    min-height:520px;
    padding:0;
  }

  .hero-visual-stack{
    gap:14px;
  }

  .featured-grid,
  .archive-grid,
  .writing-grid,
  .snapshot-stack,
  .case-card-grid,
  .deliverable-grid,
  .proof-grid,
  .hero-stats{
    grid-template-columns:1fr;
  }

  .case-story-intro{
    grid-template-columns:1fr;
  }

  .case-flow-track{
    grid-template-columns:1fr 1fr;
  }

  .case-flow-track::before{
    left:20%;
    right:20%;
    top:28px;
  }

  .snapshot-card-inner{
    grid-template-columns:1fr;
  }

  .snapshot-card-large{
    min-height:auto;
  }

  .snapshot-graphic{
    min-height:90px;
  }

  .page-hero{
    padding:58px 0 44px;
  }

  .page-hero-tight h1{
    max-width:18ch;
  }

  .page-hero-side{
    padding-right:0;
    max-width:none;
  }

  .page-hero::before{
    width:300px;
    height:300px;
    right:40px;
    top:28px;
  }

  .page-hero::after{
    width:170px;
    height:170px;
    right:-10px;
    top:132px;
  }
}

@media (max-width: 760px){
  :root{
    --content:min(100vw - 24px, 1320px);
  }

  .nav-inner{
    min-height:auto;
    padding:10px 0 0;
    gap:10px;
    flex-direction:column;
    align-items:stretch;
  }

  .brand{
    font-size:1.16rem;
    padding:0 2px 10px;
  }

  .nav-links{
    display:grid;
    grid-template-columns:repeat(5, minmax(0, 1fr));
    align-items:stretch;
    width:100%;
    border-top:1px solid var(--line);
  }

  .nav-links a{
    min-height:48px;
    padding:0 8px;
    border-top:none;
    border-left:1px solid var(--line);
    font-size:.66rem;
    letter-spacing:.09em;
  }

  .nav-links a.cta{
    margin:0;
    min-height:48px;
    padding:0 8px;
  }

  .nav-links a:first-child{
    border-left:none;
  }

  .section,
  .page-hero,
  .case-hero{
    padding:42px 0;
  }

  h2{
    font-size:clamp(1.9rem, 9vw, 2.6rem);
  }

  .lede{
    font-size:.96rem;
    line-height:1.68;
  }

  .hero{
    grid-template-columns:1fr;
    min-height:auto;
  }

  .hero-copy{
    padding:24px 0 10px;
    gap:12px;
  }

  .hero-copy h1{
    max-width:13ch;
    font-size:clamp(2.15rem, 10vw, 3rem);
    line-height:1.02;
    letter-spacing:-.05em;
  }

  .hero-grid-text{
    gap:10px;
    max-width:none;
  }

  .hero-copy .lede,
  .hero-note{
    max-width:none;
    font-size:.94rem;
    line-height:1.66;
  }

  .hero-actions{
    gap:10px;
  }

  .button{
    min-height:42px;
    padding:0 16px;
    font-size:.72rem;
  }

  .hero-proof-points{
    display:grid;
    grid-template-columns:1fr;
    gap:8px;
    max-width:none;
  }

  .hero-proof-point{
    width:100%;
    justify-content:flex-start;
  }

  .hero-stats{
    grid-template-columns:1fr;
  }

  .hero-visual{
    min-height:320px;
    padding:0;
  }

  .portrait-wrap{
    position:relative;
    width:min(460px,100%);
    height:auto;
    margin:0 auto;
  }

  .portrait-wrap img{
    width:100%;
    height:auto;
    max-height:460px;
    object-position:center bottom;
    transform:none;
  }

  .status-pill-portrait{
    top:10px;
    right:10px;
    font-size:.68rem;
  }

  .section-head{
    flex-direction:column;
    align-items:flex-start;
    gap:12px;
  }

  .section-head .lede{
    max-width:none;
  }

  .clean-board-head{
    gap:8px;
    margin-bottom:22px;
  }

  .snapshot-card,
  .panel,
  .timeline-card,
  .proof-card,
  .contact-card{
    padding:20px;
    border-radius:20px;
  }

  .snapshot-card-large{
    min-height:auto;
  }

  .snapshot-card-inner{
    gap:16px;
  }

  .snapshot-graphic{
    min-height:72px;
  }

  .snapshot-card-large p,
  .snapshot-card p{
    font-size:.95rem;
    line-height:1.68;
  }

  .story-block{
    gap:24px;
  }

  .story-grid{
    gap:18px;
  }

  .story-copy h2{
    max-width:12ch;
    font-size:clamp(2rem, 9vw, 2.7rem);
  }

  .story-side{
    padding-top:0;
  }

  .story-process{
    padding-top:18px;
  }

  .story-process-grid{
    grid-template-columns:1fr 1fr;
    gap:18px;
  }

  .story-process-step{
    justify-items:flex-start;
    text-align:left;
    padding-top:24px;
  }

  .story-process-step::before{
    left:0;
    transform:none;
  }

  .story-process-step::after{
    display:none;
  }

  .featured-grid,
  .archive-grid,
  .writing-grid,
  .milestone-strip,
  .personal-strip,
  .proof-grid,
  .skills-columns{
    gap:14px;
  }

  .skills-columns{
    padding:18px;
    display:grid;
    gap:16px;
    grid-template-columns:1fr;
  }

  .skills-board{
    grid-template-columns:1fr;
  }

  .skills-panel{
    padding:20px;
    border-right:none;
    border-bottom:1px solid rgba(23,20,17,.12);
  }

  .skills-panel:last-child{
    border-bottom:none;
  }

  .work-filter-bar{
    gap:10px;
    margin-bottom:22px;
  }

  .work-filter-chip{
    min-height:38px;
    padding:0 14px;
    font-size:.72rem;
  }

  .featured-card,
  .featured-card.large{
    min-height:320px;
    border-radius:24px;
  }

  .featured-body{
    padding:18px;
  }

  .featured-body h3{
    font-size:1.45rem;
  }

  .featured-body p{
    font-size:.92rem;
  }

  .archive-card{
    padding:18px;
  }

  .archive-card.visual{
    padding:0 0 18px;
  }

  .archive-card.visual img,
  .archive-art{
    height:180px;
  }


  .archive-card.visual .meta,
  .archive-card.visual strong,
  .archive-card.visual p,
  .archive-card.visual .archive-link{
    padding-left:18px;
    padding-right:18px;
  }

  .page-hero{
    padding:44px 0 34px;
  }

  .page-hero .container{
    gap:16px;
  }

  .case-summary-grid{
    grid-template-columns:1fr;
    gap:14px;
  }

  .page-hero-tight h1{
    max-width:11ch;
  }

  .page-hero-side .lede{
    line-height:1.7;
  }

  .about-intro-grid{
    gap:18px;
  }

  .about-photo{
    padding:14px;
    border-radius:22px;
  }

  .about-photo img{
    border-radius:14px;
  }

  .about-intro-copy{
    gap:12px;
  }

  .about-personal-tags{
    gap:8px;
  }

  .about-personal-tags span,
  .timeline-summary-tags span,
  .skill-tags span{
    font-size:.78rem;
    padding:8px 11px;
  }

  .map-layout,
  .timeline-grid{
    gap:18px;
  }

  .story-process-grid{
    grid-template-columns:1fr;
  }

  .journey-flow{
    padding-left:24px;
    gap:12px;
  }

  .journey-flow::before{
    left:8px;
    top:8px;
    height:calc(100% - 80px);
  }

  .journey-step{
    padding-left:14px;
  }

  .journey-step::before{
    left:-24px;
    width:16px;
    height:16px;
  }

  .timeline-list{
    gap:16px;
    margin-top:16px;
  }

  .timeline-item{
    padding-left:14px;
  }

  .timeline-item strong{
    font-size:1rem;
  }

  .milestone-card{
    padding:12px;
  }

  .personal-strip{
    grid-template-columns:1fr;
  }

  .personal-carousel{
    min-height:320px;
    transform:none;
  }

  .personal-carousel::before,
  .personal-carousel::after{
    display:none;
  }

  .personal-slide{
    inset:16px 16px 68px 16px;
  }

  .milestone-card figcaption span{
    font-size:.92rem;
  }

  .skills-board{
    gap:1px;
  }

  .skill-column{
    min-height:auto;
    padding:22px 20px 24px;
  }

  .writing-card{
    min-height:auto;
    padding:22px;
  }

  .writing-page .writing-card strong{
    font-size:1.06rem;
  }

  .contact-band{
    gap:14px;
  }

  .contact-card h2{
    font-size:clamp(1.72rem, 8.1vw, 2.12rem);
    max-width:18ch;
  }

  .contact-item{
    padding:14px 0;
  }

  .case-hero-grid{
    gap:18px;
    align-items:start;
  }

  .case-copy{
    gap:14px;
  }

  .case-story-block{
    grid-template-columns:56px 1fr;
    gap:12px;
  }

  .case-story-label{
    font-size:1.5rem;
  }

  .case-story-copy{
    padding:16px 18px;
  }

  .back-link{
    font-size:.7rem;
  }

  .case-media{
    aspect-ratio:4 / 3;
    border-radius:16px;
  }

  .case-card,
  .deliverable-card,
  .quote-band,
  .lesson-band{
    padding:18px;
  }

  .quote-band blockquote{
    font-size:1.55rem;
  }

  .footer .container{
    flex-direction:column;
    align-items:flex-start;
    gap:8px;
  }
}

@media (max-width: 480px){
  :root{
    --content:min(100vw - 18px, 1320px);
  }

  .nav-links{
    grid-template-columns:repeat(3, minmax(0, 1fr));
  }

  .nav-links a{
    min-height:44px;
  }

  .nav-links a.cta{
    grid-column:1 / -1;
  }

  .hero-copy h1{
    font-size:clamp(1.95rem, 11vw, 2.55rem);
  }

  .page-hero h1{
    font-size:clamp(2.1rem, 11vw, 3rem);
  }

  .featured-card,
  .featured-card.large{
    min-height:300px;
  }

  .archive-card.visual img,
  .archive-art{
    height:165px;
  }


  .writing-card,
  .proof-card,
  .timeline-card,
  .contact-card,
  .panel,
  .snapshot-card{
    padding:18px;
  }
}

/* About contact section refresh */
.contact-band{
  display:grid;
  grid-template-columns:minmax(0, 1fr);
  gap:24px;
}

.contact-letter{
  padding:0;
  border:none;
  background:transparent;
  box-shadow:none;
  overflow:visible;
}

.about-page #contact.section{
  padding-top:22px;
  padding-bottom:16px;
}

.home-page #contact-home.section{
  padding-top:34px;
  padding-bottom:18px;
}

.home-page #contact-home .contact-band{
  gap:18px;
}

.home-page #contact-home .contact-bouquet{
  gap:10px;
}

.home-page #contact-home .contact-bouquet-header{
  gap:6px;
  max-width:60rem;
}

.home-page #contact-home .contact-bouquet-header h3{
  font-size:clamp(2rem, 3.5vw, 3.2rem);
  line-height:1.02;
  letter-spacing:-.04em;
  max-width:none;
  white-space:normal;
}

.home-page #contact-home .contact-bouquet-header p{
  max-width:44rem;
  font-size:.9rem;
  line-height:1.42;
}

.home-page #contact-home .contact-letter-sheet{
  margin-top:2px;
}

.contact-bouquet{
  --bouquet-focus:#7f9c7f;
  display:grid;
  gap:10px;
}

.contact-bouquet-header{
  display:grid;
  gap:10px;
  max-width:60rem;
}

.contact-letter-label{
  display:inline-flex;
  align-items:center;
  gap:12px;
  width:max-content;
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#587563;
}

.contact-letter-label::before,
.contact-letter-label::after{
  content:"";
  width:54px;
  height:1px;
  background:rgba(88,117,99,.28);
}

.contact-letter-label::after{
  display:none;
}

.contact-bouquet-header h3{
  margin:0;
  max-width:none;
  font-family:var(--display);
  font-size:clamp(2rem,3.5vw,3.2rem);
  line-height:1.02;
  letter-spacing:-.04em;
  color:#24221f;
  white-space:normal;
}

.contact-bouquet-header p{
  margin:0;
  max-width:72rem;
  font-size:.96rem;
  line-height:1.56;
  color:rgba(54,49,45,.9);
}

.contact-bouquet-memory{
  white-space:nowrap;
}

.contact-bouquet-header .contact-bouquet-instruction{
  margin-top:-2px;
  font-size:.84rem;
  line-height:1.42;
  color:rgba(84,78,72,.72);
}

.bouquet-chip-label{
  font-size:.7rem;
  letter-spacing:.16em;
  text-transform:uppercase;
  color:#7c756b;
  margin-top:0;
}

.bouquet-choice-block{
  display:grid;
  gap:7px;
  margin-top:auto;
}

.bouquet-chip-row{
  display:grid;
  grid-template-columns:repeat(3, minmax(0, 1fr));
  gap:8px;
  align-content:start;
}

.bouquet-chip{
  min-height:36px;
  padding:7px 13px;
  border-radius:999px;
  border:1px solid rgba(44,44,42,.1);
  background:rgba(255,255,255,.55);
  color:rgba(64,60,56,.86);
  font-size:.78rem;
  letter-spacing:.03em;
  line-height:1;
  box-shadow:0 8px 16px rgba(23,20,17,.03);
  transition:transform .24s ease, border-color .24s ease, background .24s ease, box-shadow .24s ease, color .24s ease;
  text-align:center;
  justify-content:center;
}

.bouquet-chip:hover,
.bouquet-chip:focus-visible{
  transform:translateY(-1px);
  border-color:color-mix(in srgb, var(--chip-color) 55%, rgba(44,44,42,.12));
  background:color-mix(in srgb, var(--chip-color) 8%, #fff);
  color:#2C2C2A;
  box-shadow:0 14px 24px rgba(23,20,17,.06);
}

.bouquet-chip.is-active{
  background:color-mix(in srgb, var(--chip-color) 24%, #fffaf6);
  border-color:color-mix(in srgb, var(--chip-color) 84%, rgba(44,44,42,.12));
  color:#24221f;
  box-shadow:0 0 0 1px color-mix(in srgb, var(--chip-color) 36%, transparent), 0 12px 22px rgba(23,20,17,.06);
}

.contact-letter-sheet{
  display:grid;
}

.contact-bouquet-card{
  position:relative;
  overflow:hidden;
  padding:8px;
  border-radius:24px;
  border:1px solid rgba(56,48,40,.08);
  background:
    radial-gradient(circle at 14% 16%, rgba(255,255,255,.75), transparent 28%),
    radial-gradient(circle at 84% 18%, rgba(214,201,222,.18), transparent 22%),
    linear-gradient(180deg, #f4efe7 0%, #efe7dc 100%);
  box-shadow:0 22px 46px rgba(34,27,22,.06);
}

.bouquet-stage{
  display:grid;
  grid-template-columns:minmax(0, 38%) minmax(0, 62%);
  gap:12px;
  align-items:stretch;
  min-height:392px;
}

.bouquet-visual-panel{
  display:grid;
  gap:12px;
  grid-template-rows:auto 1fr auto;
  align-content:stretch;
  min-height:100%;
  height:100%;
  padding:16px 14px 14px;
  border-radius:18px;
  background:linear-gradient(180deg, rgba(255,255,255,.34), rgba(255,255,255,.14));
  border:1px solid rgba(255,255,255,.42);
}

.bouquet-visual-copy{
  display:grid;
  gap:5px;
  max-width:none;
}

.bouquet-visual-label,
.bouquet-note-kicker{
  font-size:.7rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#7c756b;
}

.bouquet-visual-text,
.bouquet-note-head p{
  margin:0;
  font-size:.9rem;
  line-height:1.42;
  color:rgba(69,64,58,.76);
}

.bouquet-visual-text{
  display:grid;
  gap:2px;
}

.bouquet-visual-text span{
  white-space:nowrap;
}

.bouquet-vase-column{
  display:grid;
  justify-items:center;
  gap:10px;
  align-self:center;
  justify-self:center;
  width:100%;
  margin-top:0;
}

.bouquet-vase-wrap{
  width:100%;
  max-width:212px;
  display:flex;
  justify-content:center;
  align-items:flex-end;
}

.bouquet-vase-svg{
  width:100%;
  height:auto;
  display:block;
  overflow:visible;
}

.bouquet-shadow{
  fill:rgba(131,122,113,.12);
}

.bouquet-vase-outline{
  opacity:.98;
}

.bouquet-vase-note{
  margin:0;
  max-width:none;
  text-align:center;
  font-size:.76rem;
  line-height:1.24;
  color:rgba(78,74,68,.72);
  width:max-content;
  justify-self:center;
}

.bouquet-note-card{
  position:relative;
  display:grid;
  gap:6px;
  align-self:stretch;
  height:100%;
  padding:14px 16px 12px;
  border-radius:18px;
  border:1px solid rgba(56,48,40,.08);
  background:#fdf9f2;
  box-shadow:0 14px 28px rgba(32,24,19,.045);
  align-content:start;
}

.bouquet-note-head{
  display:grid;
  gap:3px;
  padding-bottom:6px;
  border-bottom:1px solid rgba(163,145,122,.16);
  width:100%;
  max-width:none;
}

.bouquet-note-head p{
  max-width:none;
}

.bouquet-note-form{
  display:grid;
  gap:4px;
  width:100%;
  max-width:none;
  align-content:start;
  height:100%;
}

.bouquet-note-body{
  display:grid;
  gap:4px;
  width:100%;
  max-width:none;
}

.bouquet-field-grid{
  display:grid;
  gap:4px;
  width:100%;
}

.bouquet-field-grid-two{
  grid-template-columns:repeat(2, minmax(0, 1fr));
}

.bouquet-field-grid-soft{
  align-items:start;
}

.bouquet-field{
  display:grid;
  gap:3px;
  width:100%;
}

.bouquet-field span{
  font-size:.68rem;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:#756f66;
}

.bouquet-field span small{
  font:inherit;
  letter-spacing:.06em;
  text-transform:none;
  color:rgba(117,111,102,.74);
}

.bouquet-field input,
.bouquet-field textarea{
  width:100%;
  border:none;
  border-radius:18px;
  background:#fffdfa;
  padding:8px 12px;
  font:inherit;
  font-size:.92rem;
  line-height:1.35;
  color:#25221f;
  border:1px solid rgba(120,109,95,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.6);
  transition:border-color .22s ease, box-shadow .22s ease, transform .22s ease;
}

.bouquet-field input{
  min-height:42px;
}

.bouquet-field textarea{
  min-height:126px;
  resize:vertical;
}

.bouquet-field input::placeholder,
.bouquet-field textarea::placeholder{
  color:#a89f94;
}

.bouquet-field input:focus,
.bouquet-field textarea:focus{
  outline:none;
  border-color:color-mix(in srgb, var(--bouquet-focus) 42%, rgba(120,109,95,.18));
  box-shadow:0 0 0 4px color-mix(in srgb, var(--bouquet-focus) 12%, transparent);
}

.bouquet-field-static{
  align-content:start;
}

.bouquet-selection-list{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  min-height:18px;
  align-content:flex-start;
}

.bouquet-selection-pill{
  display:inline-flex;
  align-items:center;
  min-height:18px;
  padding:5px 10px;
  border-radius:999px;
  font-size:.72rem;
  letter-spacing:.02em;
  color:#403b36;
  background:rgba(255,255,255,.76);
  border:1px solid color-mix(in srgb, var(--pill-color, #c8c0b4) 55%, rgba(108,98,87,.12));
}

.bouquet-selection-pill.is-empty{
  color:#8b837a;
  border-style:dashed;
  border-color:rgba(120,109,95,.18);
  background:rgba(255,255,255,.46);
}

.bouquet-soft-hint{
  min-height:1.2em;
  margin:0;
  font-size:.76rem;
  line-height:1.24;
  color:#7c756d;
  transition:color .22s ease, opacity .22s ease, transform .22s ease;
}

.bouquet-soft-hint.is-error{
  color:#b45d5f;
}

.bouquet-soft-hint.is-success{
  color:#5e7a67;
}

.bouquet-soft-hint.is-sending{
  color:#6a7267;
}

.bouquet-note-footer{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:6px;
  padding-top:8px;
  margin-top:auto;
  border-top:1px solid rgba(163,145,122,.16);
}

.bouquet-note-actions{
  display:flex;
  align-items:center;
}

.bouquet-send{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:38px;
  padding:0 16px;
  border:none;
  border-radius:999px;
  background:#2d3530;
  color:#faf7f2;
  font-size:.76rem;
  letter-spacing:.02em;
  box-shadow:0 16px 28px rgba(34,31,27,.14);
  transition:transform .22s ease, box-shadow .22s ease, background .22s ease;
}

.bouquet-send:disabled{
  cursor:wait;
}

.bouquet-send:hover,
.bouquet-send:focus-visible{
  transform:translateY(-1px);
  background:#46574f;
  box-shadow:0 20px 32px rgba(34,31,27,.17);
}

.bouquet-send-check{
  opacity:0;
  transform:scale(.82);
  transition:opacity .18s ease, transform .18s ease;
}

.bouquet-send.is-sent{
  background:#4d6655;
}

.bouquet-send.is-loading{
  background:#56655d;
  box-shadow:0 18px 30px rgba(34,31,27,.16);
}

.bouquet-send.is-sent .bouquet-send-check{
  opacity:1;
  transform:scale(1);
}

.bouquet-direct{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:flex-end;
  gap:6px 10px;
  margin-left:auto;
  font-size:.72rem;
  line-height:1.2;
  color:rgba(78,74,68,.72);
}

.bouquet-chip[data-skill-key="research"],
.bouquet-chip[data-skill-key="strategy"],
.bouquet-chip[data-skill-key="systems"]{
  background:color-mix(in srgb, var(--chip-color) 14%, #fffdf9);
  border-color:color-mix(in srgb, var(--chip-color) 52%, rgba(44,44,42,.12));
}

.bouquet-direct a{
  color:#54786f;
  text-decoration:underline;
  text-underline-offset:3px;
}

.bouquet-icons{
  display:flex;
  align-items:center;
  gap:10px;
  margin-left:4px;
}

.bouquet-icons a{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
  color:#8c877f;
  text-decoration:none;
  transition:color .2s ease, transform .2s ease;
}

.bouquet-icons a:hover,
.bouquet-icons a:focus-visible{
  color:#54786f;
  transform:translateY(-1px);
}

.bouquet-icons svg{
  width:16px;
  height:16px;
  fill:currentColor;
}

.bouquet-flower{
  transform-origin:90px 232px;
  opacity:0;
  animation:
    bouquet-plant-rise .82s cubic-bezier(.22,.72,.24,1) forwards,
    bouquet-sway-premium 6.6s ease-in-out infinite alternate;
  animation-delay:var(--flower-delay, 0s), calc(var(--flower-delay, 0s) + .86s);
}

.bouquet-stem-line{
  fill:none;
  stroke:var(--stem-color, #7b9076);
  stroke-width:1.2;
  stroke-linecap:round;
  stroke-linejoin:round;
  opacity:.92;
}

.bouquet-root-line{
  fill:none;
  stroke:var(--stem-color, #7b9076);
  stroke-width:1;
  stroke-linecap:round;
  opacity:.34;
}

.bouquet-stem-guide{
  fill:none;
  stroke:var(--stem-color, #7b9076);
  stroke-width:.92;
  stroke-linecap:round;
  opacity:.24;
}

.bouquet-leaf{
  fill:var(--leaf-color, #8aa284);
  opacity:.92;
}

.bouquet-bloom{
  opacity:.98;
}

.bouquet-bloom path,
.bouquet-bloom ellipse,
.bouquet-bloom circle{
  vector-effect:non-scaling-stroke;
}

.contact-bouquet.is-celebrating .bouquet-flower{
  animation:bouquet-lift .78s ease;
}

@keyframes bouquet-plant-rise{
  from{
    opacity:0;
    transform:translateY(16px) scale(.97);
  }
  to{
    opacity:1;
    transform:translateY(0) scale(1);
  }
}

@keyframes bouquet-sway-premium{
  from{
    transform:rotate(-1.45deg) translateY(0);
  }
  to{
    transform:rotate(1.45deg) translateY(-1px);
  }
}

@keyframes bouquet-lift{
  0%, 100%{
    transform:translateY(0);
  }
  45%{
    transform:translateY(-4px);
  }
}

@media (max-width: 1100px){
  .contact-bouquet-memory{
    white-space:normal;
  }

  .bouquet-visual-text span{
    white-space:normal;
  }

  .bouquet-stage{
    grid-template-columns:1fr;
    gap:12px;
    min-height:unset;
  }

  .bouquet-visual-panel{
    min-height:unset;
    height:auto;
  }

  .bouquet-note-card{
    height:auto;
  }
}

@media (max-width: 820px){
  .contact-bouquet-card{
    padding:14px;
    border-radius:20px;
  }

  .contact-bouquet-header h3{
    white-space:normal;
  }

  .bouquet-note-card,
  .bouquet-visual-panel{
    padding:14px;
    border-radius:16px;
  }

  .bouquet-field-grid-two{
    grid-template-columns:1fr;
  }

  .bouquet-direct{
    justify-content:flex-start;
    margin-left:0;
  }

  .bouquet-note-footer{
    align-items:flex-start;
    justify-content:flex-start;
  }
}

@media (max-width: 640px){
  .contact-bouquet{
    gap:10px;
  }

  .bouquet-chip-row{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
  }

  .bouquet-chip{
    min-height:38px;
    padding:9px 13px;
    font-size:.78rem;
  }

  .bouquet-stage{
    gap:12px;
  }

  .bouquet-vase-wrap{
    max-width:240px;
  }

  .bouquet-note-card,
  .bouquet-visual-panel{
    padding:12px;
  }

  .bouquet-send{
    width:100%;
  }

  .bouquet-note-actions{
    width:100%;
  }
}

@media (max-width: 480px){
  .contact-bouquet-header h3{
    max-width:16ch;
    white-space:normal;
  }

  .contact-bouquet-card{
    padding:12px;
  }

  .bouquet-note-card,
  .bouquet-visual-panel{
    padding:12px;
  }

  .bouquet-field input,
  .bouquet-field textarea{
    padding:13px 14px;
    border-radius:16px;
  }

  .bouquet-direct{
    flex-direction:column;
    align-items:flex-start;
  }

  .bouquet-icons{
    margin-left:0;
  }
}
.contact-cv-links{
  display:flex;
  flex-wrap:wrap;
  gap:8px 12px;
  margin-top:0;
}

.contact-cv-links a{
  font-size:.84rem;
  color:var(--sage);
  text-decoration:none;
  border-bottom:1px solid rgba(95,123,98,.22);
  padding-bottom:1px;
  transition:color .2s ease, border-color .2s ease;
}

.contact-cv-links a:hover{
  color:var(--ink);
  border-color:rgba(23,20,17,.22);
}
