:root{
  --bg:#050505;--panel:#0d0d0d;--ink:#f4f4f2;--muted:#aaa79f;--line:#262626;
  --green:#60b649;--accent:#d7a86e;--max:1240px
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;line-height:1.7}
a{color:inherit;text-decoration:none}
img{display:block;width:100%;height:100%;object-fit:cover}
header{position:fixed;top:0;left:0;right:0;z-index:50;height:72px;padding:0 4vw;display:flex;align-items:center;justify-content:space-between;background:rgba(5,5,5,.72);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.07)}
.brand{display:flex;flex-direction:column;line-height:1}
.brand b{font-size:18px;letter-spacing:.17em}
.brand span{font-size:7px;letter-spacing:.29em;color:#999;margin-top:6px}
nav{display:flex;gap:28px;font-size:11px;letter-spacing:.12em}
nav a{opacity:.8} nav a:hover{opacity:1}
.menu{display:none;background:transparent;color:#fff;border:0;font-weight:700}
.hero{min-height:100svh;position:relative;display:flex;align-items:flex-end;overflow:hidden}
.hero-media{position:absolute;inset:0}
.hero-media:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.08),rgba(0,0,0,.18) 45%,rgba(0,0,0,.84))}
.hero-copy{position:relative;z-index:2;padding:0 6vw 9vh;max-width:920px}
.kicker{font-size:10px;letter-spacing:.28em;color:#d5d5d0;font-weight:700}
.hero h1{font-size:clamp(48px,8vw,108px);line-height:1.02;letter-spacing:-.05em;margin:14px 0 22px}
.hero p{max-width:620px;color:#d0ccc4;font-size:16px}
.cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 22px;border:1px solid #3c3c3c;font-size:12px;font-weight:800;letter-spacing:.08em}
.btn.primary{background:#fff;color:#0a0a0a;border-color:#fff}
.btn.green{background:var(--green);border-color:var(--green);color:#081306}
.section{padding:110px 6vw}
.wrap{max-width:var(--max);margin:auto}
.eyebrow{font-size:10px;letter-spacing:.28em;color:#8c8982;font-weight:800;margin:0 0 18px}
h2{font-size:clamp(34px,5vw,68px);line-height:1.12;letter-spacing:-.04em;margin:0 0 28px}
.lead{font-size:18px;color:#b9b5ae;max-width:760px}
.black{background:#050505}.soft{background:#0b0b0b}
.full-image{height:min(78vw,780px);position:relative;overflow:hidden}
.full-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 35%,rgba(0,0,0,.7))}
.overlay-copy{position:absolute;z-index:2;left:6vw;bottom:7vh;max-width:740px}
.overlay-copy h2{margin-bottom:10px}
.overlay-copy p{color:#d0ccc4}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.card{background:#101010;border:1px solid var(--line);overflow:hidden}
.card .media{aspect-ratio:4/3}
.card .copy{padding:30px}
.card h3{font-size:28px;margin:0 0 10px}
.card p{color:#999}
.brand-row{display:grid;grid-template-columns:.8fr 1.2fr;gap:48px;align-items:center}
.logo-box{background:#111;border:1px solid var(--line);padding:28px;min-height:380px}
.logo-box img{object-fit:contain}
.info-list{border-top:1px solid var(--line);margin-top:28px}
.info-list div{display:grid;grid-template-columns:130px 1fr;padding:15px 0;border-bottom:1px solid var(--line)}
.info-list b{font-size:11px;color:#777;letter-spacing:.08em}
.info-list span{color:#c7c3bb}
.news-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:36px}
.news-card{border-top:1px solid var(--line);padding-top:18px}
.news-card .thumb{aspect-ratio:1/1;overflow:hidden;margin-bottom:15px}
.news-card small{color:#777}.news-card p{color:#bbb}
.placeholder{border:1px dashed #333;padding:20px;color:#777;font-size:13px}
.footer{padding:65px 6vw;background:#030303;border-top:1px solid var(--line)}
.footer-grid{max-width:var(--max);margin:auto;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:30px}
.footer b{letter-spacing:.14em}.footer p,.footer a{color:#777;font-size:12px}.legal{margin-top:45px;color:#555;font-size:10px}
@media(max-width:900px){
  nav{display:none}.menu{display:block}
  body.menu-open nav{display:flex;position:absolute;top:72px;left:0;right:0;background:#090909;flex-direction:column;padding:24px 6vw;border-bottom:1px solid #222}
  .grid2,.brand-row,.footer-grid{grid-template-columns:1fr}
  .news-grid{grid-template-columns:1fr}
  .section{padding:78px 22px}
  .hero-copy{padding:0 22px 8vh}
  .overlay-copy{left:22px;right:22px;bottom:35px}
  .full-image{height:72vh}
  .logo-box{min-height:300px}
}
@media(min-width:901px) and (max-width:1200px){
  .news-grid{grid-template-columns:repeat(2,1fr)}
}


/* v5 mobile typography refinement */
@media(max-width:560px){
  body{font-size:15px;line-height:1.75}
  .brand b{font-size:15px;letter-spacing:.13em}
  .brand span{font-size:6px;letter-spacing:.20em}
  .hero{min-height:88svh}
  .hero-copy{padding:0 20px 7vh;max-width:100%}
  .hero h1{
    font-size:clamp(34px,10vw,44px);
    line-height:1.08;
    letter-spacing:-.035em;
    margin:12px 0 18px;
    overflow-wrap:anywhere;
  }
  .hero p{font-size:14px;line-height:1.75;max-width:92%}
  .kicker,.eyebrow{font-size:9px;letter-spacing:.20em}
  .section{padding:64px 20px}
  h2,.section h2{
    font-size:clamp(28px,8.5vw,36px);
    line-height:1.18;
    letter-spacing:-.025em;
    overflow-wrap:anywhere;
  }
  .lead{font-size:15px;line-height:1.8}
  .overlay-copy{left:20px;right:20px;bottom:28px}
  .overlay-copy h2{
    font-size:clamp(27px,8vw,34px);
    line-height:1.2;
  }
  .overlay-copy p{font-size:14px;line-height:1.7}
  .brand-copy h3,.brand-page-copy h2{font-size:32px}
  .card .copy{padding:24px 20px}
  .card h3{font-size:23px}
  .card p{font-size:14px}
  .info-list div{
    grid-template-columns:1fr;
    gap:4px;
    padding:13px 0;
  }
  .info-list b{font-size:9px}
  .info-list span{font-size:14px;overflow-wrap:anywhere}
  .btn{
    min-height:46px;
    padding:0 16px;
    font-size:10px;
    letter-spacing:.05em;
    max-width:100%;
    text-align:center;
  }
  .cta-row{gap:8px}
  .news-card p{font-size:14px}
  .footer{padding:48px 20px}
}


/* v6: smaller mobile typography + intentional line breaks */
.sp-only{display:none}

@media(max-width:560px){
  .sp-only{display:inline}

  body{font-size:14px;line-height:1.72}

  .hero h1{
    font-size:clamp(30px,8.8vw,38px);
    line-height:1.12;
    letter-spacing:-.025em;
    margin:10px 0 16px;
  }

  .hero p{
    font-size:13px;
    line-height:1.8;
    max-width:100%;
  }

  h2,.section h2{
    font-size:clamp(25px,7.4vw,31px);
    line-height:1.28;
    letter-spacing:-.015em;
    margin-bottom:20px;
  }

  .lead{
    font-size:14px;
    line-height:1.9;
  }

  .overlay-copy h2{
    font-size:clamp(24px,7.2vw,30px);
    line-height:1.28;
  }

  .overlay-copy p{
    font-size:13px;
    line-height:1.8;
  }

  .brand-copy h3,
  .brand-page-copy h2{
    font-size:28px;
    line-height:1.2;
  }

  .card h3{
    font-size:21px;
    line-height:1.3;
  }

  .card p,
  .news-card p,
  .info-list span{
    font-size:13px;
    line-height:1.75;
  }

  .section{
    padding:58px 20px;
  }

  .full-image{
    height:64vh;
  }

  .btn{
    min-height:44px;
    font-size:9px;
    padding:0 14px;
  }
}


/* v7 desktop-safe responsive break handling */
.sp-only{display:inline}
.sp-extra{display:none}

@media(max-width:560px){
  .sp-extra{display:inline}
}


/* v8: mobile company-name refinement */
@media(max-width:560px){
  .company-name{
    font-size:clamp(22px,6.2vw,27px) !important;
    line-height:1.35 !important;
    letter-spacing:-.02em !important;
    word-break:keep-all;
    overflow-wrap:normal;
  }
}


/* v10 final responsive corrections */

/* Desktop / large tablet: keep the experience headline to two clean lines */
.experience-title{
  font-size:clamp(32px,3.15vw,46px) !important;
  line-height:1.14 !important;
  letter-spacing:-.025em !important;
  max-width:1080px;
  white-space:normal;
}
.overlay-copy{
  max-width:1080px;
}

/* Portrait phones: company name must stay on one line */
@media (max-width:560px) and (orientation:portrait){
  .company-name{
    font-size:clamp(16px,5.0vw,20px) !important;
    line-height:1.25 !important;
    letter-spacing:-.045em !important;
    white-space:nowrap !important;
    word-break:normal !important;
    overflow-wrap:normal !important;
  }

  .experience-title{
    font-size:clamp(22px,6.6vw,28px) !important;
    line-height:1.24 !important;
  }
}

/* Landscape phones: compact the hero so the headline is never hidden by header */
@media (max-width:950px) and (max-height:560px) and (orientation:landscape){
  header{
    height:58px;
    padding:0 28px;
  }
  .brand b{
    font-size:14px;
  }
  .brand span{
    font-size:6px;
    margin-top:4px;
  }
  .menu{
    font-size:12px;
  }

  .hero{
    min-height:100svh;
    align-items:flex-end;
  }
  .hero-copy{
    padding:0 32px 18px !important;
    max-width:760px;
  }
  .hero h1{
    font-size:clamp(30px,6.2vw,46px) !important;
    line-height:1.04 !important;
    margin:6px 0 10px !important;
    letter-spacing:-.03em !important;
  }
  .hero p{
    font-size:12px !important;
    line-height:1.55 !important;
    max-width:680px !important;
    margin:0;
  }
  .hero .kicker{
    font-size:8px !important;
    letter-spacing:.18em !important;
    margin-bottom:5px !important;
  }
  .cta-row{
    margin-top:12px !important;
    gap:8px !important;
  }
  .btn{
    min-height:38px !important;
    padding:0 14px !important;
    font-size:9px !important;
  }

  /* Other large headings in landscape phone: keep to roughly two lines */
  h2,.section h2{
    font-size:clamp(24px,4.8vw,34px) !important;
    line-height:1.17 !important;
  }
  .experience-title{
    font-size:clamp(24px,4.7vw,34px) !important;
    line-height:1.16 !important;
  }
  .company-name{
    font-size:clamp(18px,3.2vw,25px) !important;
    white-space:nowrap !important;
    letter-spacing:-.035em !important;
  }
  .section{
    padding:48px 32px !important;
  }
  .full-image{
    height:100svh !important;
  }
  .overlay-copy{
    left:32px !important;
    right:32px !important;
    bottom:24px !important;
    max-width:760px !important;
  }
}

/* v11: photo curation — unique images, food / ingredients / place grouping */
.atmosphere-section{padding-bottom:70px}
.atmosphere-grid{display:grid;grid-template-columns:1fr 1.35fr;gap:18px;margin-top:38px}
.atmosphere-grid figure{margin:0;overflow:hidden;border:1px solid var(--line);background:#0d0d0d;min-height:420px}
.atmosphere-grid figure:first-child{aspect-ratio:3/4}
.atmosphere-grid figure:last-child{aspect-ratio:4/3;align-self:end}
.atmosphere-grid img{object-position:center}
.text-card-grid .text-card{min-height:220px;display:flex;align-items:flex-end}
.text-card-grid .text-card .copy{width:100%}
.gallery-block{margin-top:72px;padding-top:36px;border-top:1px solid var(--line)}
.gallery-heading{display:grid;grid-template-columns:minmax(220px,.65fr) 1.35fr;gap:32px;align-items:end;margin-bottom:24px}
.gallery-heading>div{display:flex;align-items:baseline;gap:14px}
.gallery-heading h3{font-size:30px;margin:0;letter-spacing:-.02em}
.gallery-heading p{margin:0;color:#aaa79f;max-width:720px}
.gallery-index{font-size:10px;color:#666;letter-spacing:.18em}
.photo-grid{display:grid;gap:16px}
.cuisine-grid{grid-template-columns:repeat(3,1fr)}
.ingredient-grid{grid-template-columns:repeat(3,1fr)}
.photo-card{margin:0;background:#0e0e0e;border:1px solid var(--line);overflow:hidden}
.photo-card .photo{aspect-ratio:4/3;overflow:hidden}
.photo-card figcaption{padding:16px 18px 18px;color:#bcb8b0;font-size:13px;line-height:1.7}
.wide-photo{margin:0;aspect-ratio:16/8;overflow:hidden;border:1px solid var(--line)}
.text-news{min-height:140px;display:flex;flex-direction:column;justify-content:flex-end;padding:18px;border:1px solid var(--line)}
.text-news-grid{margin-top:28px}

@media(max-width:900px){
  .atmosphere-grid{grid-template-columns:1fr 1fr}
  .atmosphere-grid figure{min-height:0}
  .cuisine-grid{grid-template-columns:repeat(2,1fr)}
  .ingredient-grid{grid-template-columns:1fr}
  .gallery-heading{grid-template-columns:1fr;gap:12px}
}
@media(max-width:560px){
  .atmosphere-grid{grid-template-columns:1fr;gap:12px;margin-top:26px}
  .atmosphere-grid figure:first-child,.atmosphere-grid figure:last-child{aspect-ratio:4/3}
  .cuisine-grid{grid-template-columns:1fr}
  .photo-grid{gap:12px}
  .gallery-block{margin-top:52px;padding-top:28px}
  .gallery-heading h3{font-size:24px}
  .photo-card figcaption{font-size:12px;padding:13px 14px 15px}
  .wide-photo{aspect-ratio:4/3}
  .text-card-grid .text-card{min-height:150px}
}


/* v13: phone headlines stay exactly two lines */
@media(max-width:560px){
  .mobile-two-line{
    font-size:clamp(21px,5.8vw,24px) !important;
    line-height:1.30 !important;
    letter-spacing:-.035em !important;
  }
  .mobile-two-line .title-line{
    white-space:nowrap;
  }
}

/* v14: iPhone / smartphone landscape hero hardening
   Keep all hero content below the fixed header and inside the short viewport. */
@media (orientation:landscape) and (max-width:1100px) and (max-height:700px){
  header{
    height:56px !important;
    padding:0 24px !important;
  }
  body.menu-open nav{top:56px !important;}
  .brand b{font-size:13px !important;}
  .brand span{font-size:5.5px !important;margin-top:3px !important;}
  .menu{font-size:11px !important;}

  .hero{
    min-height:100svh !important;
    height:100svh !important;
    padding-top:56px !important;
    align-items:stretch !important;
  }
  .hero-media{
    top:56px !important;
  }
  .hero-copy{
    min-height:calc(100svh - 56px) !important;
    max-height:calc(100svh - 56px) !important;
    padding:10px 28px 12px !important;
    max-width:760px !important;
    display:flex !important;
    flex-direction:column !important;
    justify-content:center !important;
    overflow:hidden !important;
  }
  .hero .kicker{
    font-size:7px !important;
    line-height:1.1 !important;
    letter-spacing:.16em !important;
    margin:0 0 4px !important;
  }
  .hero h1{
    font-size:clamp(24px,5.3vw,38px) !important;
    line-height:1.00 !important;
    letter-spacing:-.035em !important;
    margin:3px 0 7px !important;
  }
  .hero p{
    font-size:10.5px !important;
    line-height:1.35 !important;
    max-width:650px !important;
    margin:0 !important;
  }
  .hero p .sp-extra{
    display:none !important;
  }
  .hero .cta-row{
    margin-top:8px !important;
    gap:7px !important;
    flex-wrap:nowrap !important;
  }
  .hero .btn{
    min-height:32px !important;
    padding:0 12px !important;
    font-size:8px !important;
    white-space:nowrap !important;
  }
}

/* Extra-short landscape viewports such as Safari with toolbars visible. */
@media (orientation:landscape) and (max-width:1100px) and (max-height:430px){
  .hero-copy{padding-top:6px !important;padding-bottom:7px !important;}
  .hero .kicker{display:none !important;}
  .hero h1{font-size:clamp(22px,4.8vw,32px) !important;margin:0 0 5px !important;}
  .hero p{font-size:9.5px !important;line-height:1.28 !important;}
  .hero .cta-row{margin-top:6px !important;}
  .hero .btn{min-height:29px !important;font-size:7.5px !important;}
}


/* v15: smartphone landscape gallery refinement
   Keep D1 logo and shop description side-by-side, and show ingredient photos in 3 columns. */
@media (orientation:landscape) and (max-width:1100px) and (max-height:700px){
  .brand-row{
    grid-template-columns:minmax(240px, 0.62fr) minmax(0, 1.38fr) !important;
    gap:24px !important;
    align-items:center !important;
  }
  .logo-box{
    min-height:0 !important;
    height:clamp(180px, 42vh, 260px) !important;
    padding:18px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
  }
  .logo-box img{
    width:100% !important;
    height:100% !important;
    object-fit:contain !important;
  }
  #brands h2{
    font-size:clamp(28px, 4vw, 38px) !important;
    margin-bottom:12px !important;
  }
  #brands .lead{
    font-size:13px !important;
    line-height:1.55 !important;
    max-width:none !important;
  }
  #brands .info-list{
    margin-top:14px !important;
  }
  #brands .info-list div{
    grid-template-columns:95px 1fr !important;
    padding:9px 0 !important;
  }
  #brands .info-list b{
    font-size:9px !important;
  }
  #brands .info-list span{
    font-size:12px !important;
    line-height:1.45 !important;
  }
  #brands .cta-row{
    margin-top:12px !important;
    gap:8px !important;
    flex-wrap:wrap !important;
  }
  #brands .btn{
    min-height:34px !important;
    padding:0 12px !important;
    font-size:8px !important;
  }

  #gallery .gallery-block{
    margin-top:42px !important;
    padding-top:24px !important;
  }
  #gallery .gallery-heading{
    grid-template-columns:1fr !important;
    gap:8px !important;
    margin-bottom:16px !important;
  }
  #gallery .gallery-heading h3{
    font-size:22px !important;
  }
  #gallery .gallery-heading p{
    font-size:12px !important;
    line-height:1.55 !important;
    max-width:none !important;
  }
  .ingredient-grid{
    grid-template-columns:repeat(3, 1fr) !important;
    gap:10px !important;
  }
  .ingredient-grid .photo-card .photo{
    aspect-ratio:1 / 1 !important;
  }
  .ingredient-grid .photo-card figcaption{
    font-size:11px !important;
    line-height:1.45 !important;
    padding:10px 10px 12px !important;
  }
}

@media (orientation:landscape) and (max-width:900px) and (max-height:520px){
  .brand-row{
    grid-template-columns:minmax(190px, 0.58fr) minmax(0, 1.42fr) !important;
    gap:18px !important;
  }
  .logo-box{
    height:clamp(150px, 38vh, 210px) !important;
    padding:14px !important;
  }
  #brands .lead{font-size:12px !important; line-height:1.48 !important;}
  #brands .info-list div{grid-template-columns:86px 1fr !important; padding:7px 0 !important;}
  #brands .info-list span{font-size:11px !important;}
  #brands .btn{min-height:30px !important; font-size:7.5px !important; padding:0 10px !important;}
  .ingredient-grid{
    gap:8px !important;
  }
  .ingredient-grid .photo-card figcaption{
    font-size:10px !important;
    padding:8px 8px 10px !important;
  }
}


/* v16: Instagram latest 3-post feed */
.instagram-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
  margin-top:32px;
}
.instagram-card{
  display:block;
  min-width:0;
  border:1px solid var(--line);
  background:#0e0e0e;
  overflow:hidden;
}
.instagram-media{
  aspect-ratio:1/1;
  overflow:hidden;
  background:#111;
  display:flex;
  align-items:center;
  justify-content:center;
}
.instagram-media img{
  width:100%;
  height:100%;
  object-fit:cover;
}
.instagram-card p{
  margin:0;
  padding:14px 16px 16px;
  color:#bcb8b0;
  font-size:13px;
  line-height:1.65;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
}
.instagram-card.is-placeholder .instagram-media{
  background:linear-gradient(135deg,#111,#1a1a1a);
}
.instagram-card.is-placeholder .instagram-media span{
  color:#666;
  font-size:10px;
  font-weight:800;
  letter-spacing:.24em;
}

/* Keep 3 columns on desktop, tablets and landscape phones. */
@media (min-width:561px), (orientation:landscape){
  .instagram-grid{
    grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  }
}

/* Portrait phones only: one post per row. */
@media (max-width:560px) and (orientation:portrait){
  .instagram-grid{
    grid-template-columns:1fr !important;
    gap:12px;
    margin-top:24px;
  }
  .instagram-card p{
    font-size:12px;
    padding:12px 14px 14px;
  }
}

/* Compact captions on short landscape phones while preserving 3 columns. */
@media (orientation:landscape) and (max-width:1100px) and (max-height:700px){
  .instagram-grid{gap:10px !important;margin-top:20px !important;}
  .instagram-card p{font-size:10px !important;line-height:1.45 !important;padding:8px 10px 10px !important;}
}


/* Popup contact form */
.contact-modal{position:fixed;inset:0;z-index:9999;display:none;align-items:center;justify-content:center;padding:20px}
.contact-modal.is-open{display:flex}
.contact-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.72);backdrop-filter:blur(5px)}
.contact-modal-panel{position:relative;z-index:1;width:min(620px,100%);max-height:90vh;overflow:auto;background:#fff;color:#17212b;border-radius:20px;padding:32px;box-shadow:0 24px 70px rgba(0,0,0,.35)}
.contact-modal-close{position:absolute;right:16px;top:12px;border:0;background:transparent;font-size:32px;line-height:1;color:#52606d;cursor:pointer}
.contact-modal-kicker{margin:0 0 8px;font-size:11px;font-weight:800;letter-spacing:.16em;color:#148be0}
.contact-modal-panel h2{margin:0 0 22px;font-size:30px;line-height:1.25}
.contact-form{display:grid;gap:16px}
.contact-form label{display:grid;gap:7px}
.contact-form label>span{font-size:13px;font-weight:700}
.contact-form input,.contact-form select,.contact-form textarea{width:100%;border:1px solid #cfd6dd;border-radius:10px;background:#fff;color:#17212b;padding:12px 13px;font:inherit;outline:none}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#148be0;box-shadow:0 0 0 3px rgba(20,139,224,.12)}
.contact-form textarea{min-height:190px;resize:vertical;line-height:1.65}
.contact-submit{min-height:50px;border:0;border-radius:10px;background:#128fe8;color:#fff;font:inherit;font-weight:800;cursor:pointer}
.contact-form-note{margin:0;color:#6f7b86;font-size:12px;line-height:1.6}
body.contact-modal-open{overflow:hidden}
.contact-open-button{cursor:pointer}
@media(max-width:600px){
  .contact-modal{padding:12px}
  .contact-modal-panel{padding:26px 18px 20px;border-radius:16px}
  .contact-modal-panel h2{font-size:24px}
  .contact-form textarea{min-height:220px}
}

.contact-open-button{font-family:inherit;border:0}
.contact-modal-panel{background:#0f0f0f;color:#f4f4f2;border:1px solid #2a2a2a}
.contact-modal-close{color:#aaa}
.contact-form input,.contact-form select,.contact-form textarea{background:#151515;color:#f4f4f2;border-color:#353535}
.contact-form input:focus,.contact-form select:focus,.contact-form textarea:focus{border-color:#60b649;box-shadow:0 0 0 3px rgba(96,182,73,.12)}
.contact-modal-kicker{color:#60b649}
.contact-submit{background:#60b649;color:#081306}
.contact-form-note{color:#8c8982}


/* v19: D1 store introduction moved before Instagram, map left / logo right */
.store-intro-row{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  gap:36px !important;
  align-items:center !important;
}
.store-map-box{
  width:100%;
  min-height:420px;
  border:1px solid var(--line);
  background:#111;
  overflow:hidden;
}
.store-map-box iframe{
  display:block;
  width:100%;
  height:420px;
  border:0;
}
.store-logo-title{
  width:min(320px,72%);
  margin:0 0 22px;
  padding:14px 18px;
  background:#fff;
  border-radius:10px;
}
.store-logo-title img{
  width:100%;
  height:auto;
  max-height:120px;
  object-fit:contain;
}
.store-intro-copy .lead{
  max-width:680px;
}

@media(max-width:900px){
  .store-intro-row{
    grid-template-columns:1fr !important;
    gap:24px !important;
  }
  .store-map-box,
  .store-map-box iframe{
    min-height:340px;
    height:340px;
  }
  .store-logo-title{
    width:min(280px,70%);
  }
}

@media(max-width:560px){
  .store-map-box,
  .store-map-box iframe{
    min-height:280px;
    height:280px;
  }
  .store-logo-title{
    width:min(230px,72%);
    padding:10px 14px;
    margin-bottom:18px;
  }
}

.company-lead{
  margin:-8px 0 22px;
  color:#b9b5ae;
  font-size:16px;
  letter-spacing:.02em;
}
@media(max-width:560px){
  .company-lead{font-size:14px;margin:-4px 0 18px;}
}