:root{--ink:#171512;--paper:#f4efe7;--cream:#e9dfd1;--plum:#352233;--muted:#766f66;--line:rgba(23,21,18,.16)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:Manrope,Arial,sans-serif;font-weight:300}img{width:100%;display:block}a{color:inherit;text-decoration:none}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:"Cormorant Garamond",serif;font-weight:500;line-height:.96}h1{font-size:clamp(4rem,9vw,9rem);letter-spacing:-.05em}h2{font-size:clamp(3rem,6vw,6rem);letter-spacing:-.04em;margin-bottom:0}h3{font-size:2rem;margin-bottom:.65rem}.site-header{height:88px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;position:absolute;z-index:20;width:100%;color:white;border-bottom:1px solid rgba(255,255,255,.25)}.brand{display:flex;align-items:center;gap:13px;font-size:.76rem;letter-spacing:.22em;font-weight:600}.brand-mark{width:38px;height:38px;border:1px solid currentColor;border-radius:50%;display:grid;place-items:center;font-family:"Cormorant Garamond";font-size:1rem;letter-spacing:0}.nav{display:flex;align-items:center;gap:30px;font-size:.78rem}.nav a{opacity:.82}.nav a:hover{opacity:1}.nav-cta{border:1px solid rgba(255,255,255,.65);padding:12px 18px}.menu-toggle{display:none;background:none;border:0;color:white}.hero{min-height:100vh;position:relative;display:flex;align-items:flex-end;color:white;padding:140px 4vw 7vh;overflow:hidden}.hero-image,.manifesto-image{position:absolute;inset:0;background:url('assets/hero.svg') center/cover no-repeat}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,3,32,.74),rgba(24,3,32,.05) 72%),linear-gradient(0deg,rgba(24,3,32,.34),transparent 52%)}.hero-copy{position:relative;z-index:2;max-width:940px}.hero-copy>p:not(.eyebrow){max-width:610px;font-size:1.07rem;line-height:1.8}.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-size:.68rem;font-weight:600;margin-bottom:24px}.eyebrow.dark{color:var(--muted)}.hero-actions{display:flex;align-items:center;gap:30px;margin-top:34px}.button{display:inline-flex;justify-content:center;align-items:center;padding:16px 24px;border:0;cursor:pointer;font-family:Manrope;font-size:.77rem;text-transform:uppercase;letter-spacing:.12em}.button-light{background:white;color:var(--ink)}.button-dark{background:var(--ink);color:white;width:max-content}.text-link{display:inline-block;border-bottom:1px solid currentColor;padding-bottom:5px;font-size:.78rem;text-transform:uppercase;letter-spacing:.12em}.light{color:white}.scroll-cue{position:absolute;right:4vw;bottom:7vh;z-index:2;font-size:.7rem;text-transform:uppercase;letter-spacing:.2em;writing-mode:vertical-rl}.section{padding:130px 5vw}.section-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.22em;color:var(--muted);margin-bottom:50px}.intro-grid{display:grid;grid-template-columns:1.5fr .8fr;gap:10vw}.intro-copy{font-size:1rem;line-height:1.9;padding-top:40px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:40px;margin-bottom:60px}.section-heading>p{max-width:420px;line-height:1.8;color:var(--muted)}.collections{background:#eee7dd}.collection-grid{display:grid;grid-template-columns:1.35fr .8fr;gap:24px}.collection-card{position:relative;overflow:hidden;min-height:440px}.collection-card.large{grid-row:span 2;min-height:904px}.collection-card img{height:100%;object-fit:cover;transition:transform .8s ease}.collection-card:hover img{transform:scale(1.025)}.card-copy{position:absolute;inset:auto 0 0;padding:45px 35px 30px;color:white;background:linear-gradient(transparent,rgba(0,0,0,.78))}.card-copy span{font-size:.7rem;letter-spacing:.2em}.card-copy h3{font-size:2.6rem;margin-top:10px}.card-copy p{max-width:430px;line-height:1.6}.manifesto{min-height:85vh;position:relative;color:white;display:flex;align-items:center;padding:8vw 5vw}.manifesto-image{background-image:url('assets/detail.svg')}.manifesto:after{content:"";position:absolute;inset:0;background:rgba(18,12,15,.58)}.manifesto-copy{position:relative;z-index:2;max-width:690px}.manifesto-copy p:last-child{font-size:1rem;line-height:1.8;max-width:520px;margin-top:28px}.process-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line)}.process-step{padding:35px 28px 30px 0;border-right:1px solid var(--line);min-height:280px}.process-step:not(:first-child){padding-left:28px}.process-step:last-child{border-right:0}.process-step span{color:var(--muted);font-size:.7rem;letter-spacing:.16em}.process-step h3{margin-top:60px}.process-step p{color:var(--muted);line-height:1.7}.journal{background:var(--plum);color:white}.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:rgba(255,255,255,.2)}.journal-card{background:var(--plum);padding:45px;min-height:390px}.journal-card span{font-size:.67rem;text-transform:uppercase;letter-spacing:.18em;opacity:.65}.journal-card h3{font-size:2.25rem;margin-top:70px}.journal-card p{line-height:1.7;opacity:.72}.journal-card a{display:inline-block;margin-top:20px;border-bottom:1px solid rgba(255,255,255,.6);font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;padding-bottom:5px}.enquiry{background:#dfd2c2;display:grid;grid-template-columns:.8fr 1.1fr;gap:10vw}.enquiry-copy{position:sticky;top:60px;height:max-content}.enquiry-copy>p:not(.eyebrow):not(.small-note){line-height:1.8;max-width:470px;margin-top:28px}.small-note{font-size:.74rem;line-height:1.6;color:var(--muted);margin-top:30px}.enquiry-form{display:grid;gap:25px}.enquiry-form label{display:grid;gap:9px;font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;font-weight:500}.enquiry-form input,.enquiry-form select,.enquiry-form textarea{width:100%;border:0;border-bottom:1px solid rgba(23,21,18,.35);background:transparent;padding:14px 2px;font:400 .95rem Manrope;outline:none;border-radius:0}.enquiry-form textarea{border:1px solid rgba(23,21,18,.35);padding:15px;resize:vertical}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:25px}.form-status{font-size:.78rem}.form-status.error{color:#8c1f1f}footer{background:var(--ink);color:white;padding:70px 5vw 30px;display:grid;grid-template-columns:1fr auto;gap:60px}footer>div>p{opacity:.6;font-size:.8rem;margin-top:20px}.footer-links{display:grid;grid-template-columns:repeat(2,auto);gap:18px 50px;font-size:.8rem}.copyright{grid-column:1/-1;border-top:1px solid rgba(255,255,255,.15);padding-top:25px;opacity:.5;font-size:.7rem}.reveal{opacity:0;transform:translateY(25px);transition:opacity .8s ease,transform .8s ease}.reveal.visible{opacity:1;transform:none}
@media(max-width:900px){.site-header{height:72px}.menu-toggle{display:block}.nav{display:none;position:absolute;top:72px;left:0;right:0;background:var(--ink);padding:25px 4vw;flex-direction:column;align-items:flex-start}.nav.open{display:flex}.intro-grid,.enquiry{grid-template-columns:1fr}.collection-grid{grid-template-columns:1fr}.collection-card.large{grid-row:auto;min-height:600px}.process-grid{grid-template-columns:1fr 1fr}.journal-grid{grid-template-columns:1fr}.enquiry-copy{position:static}.section{padding:90px 6vw}.section-heading{align-items:start;flex-direction:column}.hero{padding-left:6vw;padding-right:6vw}.scroll-cue{display:none}}
@media(max-width:580px){h1{font-size:4rem}.hero-actions{align-items:flex-start;flex-direction:column;gap:18px}.process-grid{grid-template-columns:1fr}.process-step{border-right:0;border-bottom:1px solid var(--line);padding-left:0!important}.form-row{grid-template-columns:1fr}.collection-card,.collection-card.large{min-height:520px}.journal-card{padding:34px;min-height:340px}footer{grid-template-columns:1fr}.footer-links{grid-template-columns:1fr 1fr}}

/* Hanusri hero watermark */
.hero-image::after{
  content:"";
  position:absolute;
  width:min(48vw,620px);
  aspect-ratio:1;
  right:3vw;
  top:50%;
  transform:translateY(-50%);
  background:url('assets/HypenLogo.png') center/contain no-repeat;
  opacity:.18;
  filter:drop-shadow(0 10px 30px rgba(20,0,30,.12));
  pointer-events:none;
}
.hero-image{background-color:#7600a8}
.hero-overlay{z-index:1}
.hero-copy,.scroll-cue{z-index:2}
@media(max-width:900px){
  .hero-image::after{width:72vw;right:-18vw;opacity:.12}
}


/* Site-wide Hyphen logo watermark: visible across every section while scrolling */
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:9999;
  pointer-events:none;
  background-image:url('assets/HypenLogo.png');
  background-repeat:repeat;
  background-position:70px 60px;
  background-size:360px auto;
  opacity:.045;
}

/* Keep the hero's larger feature watermark, while the repeating watermark continues site-wide */
@media(max-width:900px){
  body::after{
    background-size:260px auto;
    background-position:30px 40px;
    opacity:.04;
  }
}

/* Hanusri Studio full logo in the site header */
.header-brand{
  display:flex;
  align-items:center;
  height:76px;
  padding:3px 0;
}
.header-brand-logo{
  display:block;
  width:auto;
  height:72px;
  object-fit:contain;
}
@media(max-width:900px){
  .header-brand{height:64px}
  .header-brand-logo{height:60px}
}
@media(max-width:580px){
  .header-brand-logo{height:54px}
}

/* Refined Hanusri brand system */
.header-brand{
  display:flex;
  align-items:center;
  gap:12px;
  height:88px;
  padding:7px 0;
  color:#fff;
}
.header-brand-mark{
  width:54px;
  height:54px;
  object-fit:contain;
  flex:0 0 auto;
  filter:drop-shadow(0 2px 10px rgba(0,0,0,.16));
}
.header-brand-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  line-height:1;
  min-width:max-content;
}
.header-brand-copy strong{
  font-family:"Cormorant Garamond",serif;
  font-size:1.12rem;
  font-weight:600;
  letter-spacing:.19em;
}
.header-brand-copy small{
  margin-top:5px;
  color:#d8b36c;
  font-family:Manrope,Arial,sans-serif;
  font-size:.56rem;
  font-weight:600;
  letter-spacing:.42em;
}
.footer-identity{display:flex;align-items:center;gap:24px}
.footer-brand{display:block;width:128px;flex:0 0 auto}
.footer-brand img{width:100%;height:auto;object-fit:contain}
.footer-identity>p{opacity:.6;font-size:.8rem;margin:0;max-width:230px;line-height:1.7}

/* Override the earlier full-logo-only header rules */
.header-brand-logo{display:none!important}

@media(max-width:900px){
  .header-brand{height:72px;gap:9px;padding:5px 0}
  .header-brand-mark{width:45px;height:45px}
  .header-brand-copy strong{font-size:.98rem;letter-spacing:.15em}
  .header-brand-copy small{font-size:.5rem;letter-spacing:.34em}
}
@media(max-width:580px){
  .header-brand-mark{width:42px;height:42px}
  .header-brand-copy strong{font-size:.88rem}
  .header-brand-copy small{font-size:.46rem}
  .footer-identity{align-items:flex-start;flex-direction:column}
  .footer-brand{width:118px}
}

.form-status.success{color:#2f5f3a}
.enquiry-form .button:disabled{cursor:wait;opacity:.68}

/* High-clarity navbar brand fix */
.site-header{
  height:104px;
}
.header-brand{
  height:88px;
  display:flex;
  align-items:center;
  gap:16px;
  padding:6px 0;
}
.header-brand-mark{
  width:76px;
  height:62px;
  object-fit:contain;
  object-position:center;
  flex:0 0 auto;
  image-rendering:auto;
  transform:none!important;
  filter:drop-shadow(0 2px 5px rgba(0,0,0,.22));
}
.header-brand-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
  line-height:1;
  white-space:nowrap;
}
.header-brand-copy strong{
  font-family:"Cormorant Garamond",serif;
  font-size:1.28rem;
  font-weight:600;
  letter-spacing:.18em;
  color:#fff;
}
.header-brand-copy small{
  margin-top:7px;
  font-size:.56rem;
  font-weight:500;
  letter-spacing:.42em;
  color:#d9b57a;
}
@media(max-width:900px){
  .site-header{height:86px}
  .header-brand{height:74px;gap:11px}
  .header-brand-mark{width:60px;height:50px}
  .header-brand-copy strong{font-size:1.02rem;letter-spacing:.14em}
  .header-brand-copy small{font-size:.48rem;letter-spacing:.32em;margin-top:5px}
}
@media(max-width:580px){
  .header-brand-mark{width:54px;height:46px}
  .header-brand-copy strong{font-size:.92rem}
  .header-brand-copy small{font-size:.44rem}
}


/* Refined Hanusri footer */
.footer-identity{display:flex;align-items:center;gap:32px}
.footer-brand{display:block;width:150px;flex:0 0 auto}
.footer-brand img{width:100%;height:auto;object-fit:contain;filter:brightness(1.1) drop-shadow(0 5px 18px rgba(0,0,0,.22))}
.footer-message{display:flex;flex-direction:column;justify-content:center;gap:7px}
.footer-message p{margin:0}
.footer-tagline{font-family:"Cormorant Garamond",serif;font-size:clamp(1.45rem,2.1vw,2rem);font-weight:400;line-height:1.08;color:#f7efe5;letter-spacing:.01em}
.footer-location{font-family:Manrope,Arial,sans-serif;font-size:.82rem;line-height:1.5;color:rgba(255,255,255,.62);letter-spacing:.04em}
footer{border-top:1px solid rgba(201,164,92,.28)}
.copyright{border-top:1px solid rgba(201,164,92,.28)}
@media(max-width:580px){
  .footer-identity{align-items:flex-start;gap:22px}
  .footer-brand{width:138px}
  .footer-tagline{font-size:1.55rem}
}


/* Collection video and reel support */
.collection-media{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}
.collection-video{
  position:absolute;
  inset:0;
  background:#171512;
}
.video-play-button{
  position:absolute;
  top:22px;
  right:22px;
  z-index:6;
  display:inline-flex;
  align-items:center;
  gap:9px;
  border:1px solid rgba(255,255,255,.72);
  background:rgba(23,15,20,.62);
  -webkit-backdrop-filter:blur(10px);
  backdrop-filter:blur(10px);
  color:#fff;
  padding:11px 15px;
  font:600 .66rem Manrope,Arial,sans-serif;
  text-transform:uppercase;
  letter-spacing:.13em;
  cursor:pointer;
  transition:background .25s ease,transform .25s ease;
}
.video-play-button:hover,
.video-play-button.is-playing{
  background:rgba(23,15,20,.88);
  transform:translateY(-1px);
}
.collection-video::-webkit-media-controls-panel{
  background:linear-gradient(transparent,rgba(0,0,0,.78));
}
.instagram-reel-link{
  position:relative;
  z-index:7;
  display:inline-block;
  margin-top:12px;
  border-bottom:1px solid rgba(255,255,255,.65);
  padding-bottom:4px;
  font-size:.68rem;
  text-transform:uppercase;
  letter-spacing:.12em;
}
@media(max-width:580px){
  .video-play-button{top:16px;right:16px;padding:10px 12px;font-size:.6rem}
}
