/*
Theme Name: Studio Soondam
Description: Editorial portfolio and booking theme for international photography clients in Seoul.
Version: 0.1.0
Requires at least: 7.0
Requires PHP: 8.2
*/

:root {
  --ink:#191816; --muted:#6f6a63; --paper:#f8f6f1; --white:#fff; --line:#ded9d0;
  --wine:#6b2737; --gold:#b78a4b; --green:#24483c; --max:1180px;
}
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:Inter,Arial,sans-serif; line-height:1.65; }
a { color:inherit; }
img { display:block; max-width:100%; height:auto; }
.wrap { width:min(calc(100% - 40px),var(--max)); margin-inline:auto; }
.site-header { position:sticky; top:0; z-index:20; background:rgba(248,246,241,.94); border-bottom:1px solid var(--line); backdrop-filter:blur(12px); }
.header-inner { min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { color:var(--ink); text-decoration:none; font-family:Georgia,serif; font-size:1.25rem; letter-spacing:.09em; }
.brand span { display:block; color:var(--muted); font:600 .62rem/1.3 Inter,Arial,sans-serif; letter-spacing:.15em; text-transform:uppercase; }
.nav { display:flex; gap:22px; align-items:center; flex-wrap:wrap; }
.nav a { text-decoration:none; font-size:.86rem; font-weight:700; }
.nav .nav-cta { padding:10px 16px; border-radius:999px; color:var(--white); background:var(--wine); }
.hero { padding:40px 0 72px; }
.hero-grid { display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:center; }
.eyebrow { color:var(--wine); font-size:.75rem; font-weight:800; letter-spacing:.16em; text-transform:uppercase; }
h1,h2,h3 { font-family:Georgia,"Times New Roman",serif; font-weight:500; line-height:1.08; }
h1 { font-size:clamp(3rem,7vw,6.3rem); letter-spacing:-.055em; margin:.18em 0; }
h2 { font-size:clamp(2rem,4vw,3.5rem); letter-spacing:-.035em; margin:.2em 0 .55em; }
h3 { font-size:1.55rem; }
.lede { color:#4c4842; font-size:1.15rem; max-width:620px; }
.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:28px; }
.button,.wp-element-button { display:inline-flex; align-items:center; justify-content:center; border:1px solid var(--ink); border-radius:999px; padding:12px 20px; text-decoration:none; font-weight:800; }
.button.primary,.wp-element-button { color:var(--white); background:var(--wine); border-color:var(--wine); }
.hero-photo { position:relative; aspect-ratio:4/5; overflow:hidden; border-radius:180px 180px 20px 20px; background:#d8d1c6; }
.hero-photo img { width:100%; height:100%; object-fit:cover; object-position:50% 8%; }
.hero-caption { position:absolute; left:18px; bottom:18px; padding:10px 14px; color:#fff; background:rgba(20,18,16,.72); border-radius:8px; font-size:.76rem; }
.trust { border-block:1px solid var(--line); background:var(--white); }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); }
.trust-item { padding:22px; border-right:1px solid var(--line); }
.trust-item:last-child { border-right:0; }
.trust-item strong { display:block; font-family:Georgia,serif; font-size:1.1rem; }
.trust-item span { color:var(--muted); font-size:.82rem; }
.section { padding:88px 0; }
.section-soft { background:#efebe3; }
.section-head { display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:end; margin-bottom:36px; }
.section-head p { color:var(--muted); max-width:540px; }
.service-grid { display:grid; grid-template-columns:1.15fr .85fr; border:1px solid var(--line); background:var(--white); }
.service-copy { padding:clamp(28px,5vw,60px); }
.service-copy ul { padding-left:20px; }
.service-aside { padding:clamp(28px,5vw,60px); background:var(--green); color:#f3eee6; }
.service-aside dl { margin:0; }
.service-aside div { padding:16px 0; border-bottom:1px solid rgba(255,255,255,.2); }
.service-aside dt { color:#cfc8bd; font-size:.75rem; text-transform:uppercase; letter-spacing:.12em; }
.service-aside dd { margin:4px 0 0; font-weight:700; }
.portfolio-panel { overflow:hidden; border-radius:18px; background:#ddd; }
.portfolio-panel img { width:100%; }
.photo-grid { columns:3 280px; column-gap:16px; }
.photo-grid figure { break-inside:avoid; margin:0 0 16px; overflow:hidden; border-radius:12px; background:#dcd6cc; }
.photo-grid img { width:100%; transition:transform .35s ease; }
.photo-grid figure:hover img { transform:scale(1.015); }
.portfolio-page-gallery,.article-gallery { margin-top:42px; }
.option-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.info-card { min-height:280px; padding:32px; border:1px solid var(--line); background:var(--white); }
.info-card p { color:var(--muted); }
.info-card strong { color:var(--ink); }
.card-number { color:var(--wine); font-size:.78rem; font-weight:800; letter-spacing:.14em; }
.faq-list { border-top:1px solid var(--line); }
.faq-list details { border-bottom:1px solid var(--line); background:rgba(255,255,255,.55); }
.faq-list summary { cursor:pointer; padding:24px 54px 24px 22px; font-family:Georgia,serif; font-size:1.25rem; list-style:none; position:relative; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary::after { content:'+'; position:absolute; right:22px; color:var(--wine); font-family:Inter,Arial,sans-serif; }
.faq-list details[open] summary::after { content:'–'; }
.faq-list details p { margin:0; padding:0 22px 24px; color:var(--muted); max-width:850px; }
.story-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:24px; }
.story-card { padding:26px; background:var(--white); border-top:4px solid var(--gold); }
.story-card a { text-decoration:none; }
.story-card p { color:var(--muted); }
.story-card small { color:var(--wine); font-weight:800; }
.steps { display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); }
.step { min-height:210px; padding:28px; background:var(--white); }
.step b { color:var(--wine); font-size:.78rem; letter-spacing:.12em; }
.contact-band { color:#fff; background:var(--wine); }
.contact-grid { display:grid; grid-template-columns:1fr 300px; gap:50px; align-items:center; }
.contact-band .button { color:#fff; border-color:#fff; }
.qr { padding:18px; background:#fff; border-radius:16px; }
.content-shell { display:grid; grid-template-columns:minmax(0,780px) 250px; gap:64px; padding:72px 0 100px; }
.article-content { font-size:1.05rem; }
.article-content h2 { margin-top:2.3em; font-size:2rem; }
.article-content li { margin:.55em 0; }
.article-meta { color:var(--muted); }
.sidebar { border-left:1px solid var(--line); padding-left:28px; }
.sidebar a { color:var(--wine); }
.site-footer { padding:48px 0; color:#d8d2c9; background:#171715; }
.footer-grid { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.site-footer a { color:#fff; }
.site-footer small { color:#9f9a92; }
@media (max-width:850px) {
  .header-inner { align-items:flex-start; padding:16px 0; }
  .nav { gap:12px; justify-content:flex-end; }
  .hero-grid,.section-head,.service-grid,.contact-grid,.content-shell { grid-template-columns:1fr; }
  .hero-photo { max-height:680px; }
  .trust-grid,.steps { grid-template-columns:repeat(2,1fr); }
  .story-grid,.option-grid { grid-template-columns:1fr; }
  .sidebar { border-left:0; border-top:1px solid var(--line); padding:28px 0 0; }
}
@media (max-width:560px) {
  .wrap { width:min(calc(100% - 28px),var(--max)); }
  .site-header { position:static; }
  .header-inner { display:block; }
  .nav { margin-top:14px; justify-content:flex-start; }
  .nav a:not(.nav-cta) { font-size:.78rem; }
  .hero { padding-top:24px; }
  .hero-grid { gap:28px; }
  .hero-photo { border-radius:110px 110px 12px 12px; }
  .trust-grid,.steps { grid-template-columns:1fr; }
  .photo-grid { columns:1; }
  .trust-item { border-right:0; border-bottom:1px solid var(--line); }
  .section { padding:62px 0; }
  .footer-grid { grid-template-columns:1fr; }
}
