/* Seoul smile studio: a shared visual system for every locale and article. */
:root { --ink:#14344f; --ink-2:#405969; --pine:#143e55; --pine-2:#102d40; --paper:#fffefa; --cream:#f5f2ea; --sage:#d9eeea; --sage-2:#edf7f4; --gold:#926d36; --line:rgba(20,52,79,.14); --shadow:0 24px 65px rgba(20,52,79,.1); --radius:30px; }
body { background:#fffefa; }
::selection { color:#102d40; background:#d5f279; }
h1,h2,h3 { text-wrap:balance; }
.section { padding:100px 0; }
.section-head { gap:45px; }
.section-head h2 { letter-spacing:-.035em; }
.eyebrow { font-size:.7rem; letter-spacing:.16em; }
.site-header { background:rgba(255,254,250,.96); border-color:rgba(20,52,79,.09); }
.site-header .nav { height:84px; }
.site-header .brand { height:62px; }
.brand img { mix-blend-mode:multiply; }
.info-bar { background:#14344f; }
.nav-links a { position:relative; }
.nav-links a::after { content:''; position:absolute; left:0; right:0; bottom:-6px; height:2px; background:#96bfae; transform:scaleX(0); transform-origin:left; transition:transform .2s; }
.nav-links a:hover::after { transform:scaleX(1); }
.button { background:#143e55; border-color:#143e55; padding:14px 23px; box-shadow:none; }
.button:hover { box-shadow:0 9px 24px rgba(20,52,79,.13); }
.button.light { background:#d6f17b; border-color:#d6f17b; color:#14344f; }
.hero { min-height:760px; background:#f5f2ea; isolation:isolate; overflow:hidden; }
.hero::before { content:''; position:absolute; width:350px; height:350px; border:1px solid rgba(20,52,79,.1); border-radius:50%; left:-220px; bottom:-80px; z-index:-1; }
.hero-media { inset:30px 32px 38px 55%; border-radius:180px 28px 28px 28px; overflow:hidden; box-shadow:0 22px 60px rgba(20,52,79,.12); }
.hero-media img { object-position:56% center; }
.hero-media::after { background:linear-gradient(0deg,rgba(16,45,64,.32),transparent 50%); }
.hero-inner { color:var(--ink); padding:74px 0 92px; align-content:center; }
.hero-inner > * { max-width:50%; }
.hero h1 { max-width:50%; font-size:clamp(3rem,4.8vw,5.1rem); line-height:1.06; letter-spacing:-.055em; }
.hero .eyebrow { color:#526e68; max-width:46%; }
.hero-copy { color:#405969; font-size:1.04rem; line-height:1.75; max-width:45%; margin-top:26px; }
.hero-actions { gap:10px; }
.hero .button.ghost { color:var(--ink); border-color:var(--line); background:transparent; }
.hero-proof { gap:8px; margin-top:28px; }
.hero-proof .pill { color:#14344f; background:white; border-color:rgba(20,52,79,.13); font-size:.68rem; backdrop-filter:none; }
.hero-sidecard { right:64px; bottom:65px; width:auto; border-radius:20px; background:rgba(255,254,250,.93); }
.hero-sidecard div { padding:18px 20px; }
.hero-stamp { position:absolute; z-index:2; right:calc(45% - 42px); top:72px; width:112px; height:112px; display:grid; place-items:center; padding:15px; text-align:center; border-radius:50%; background:#d6f17b; color:#14344f; font-size:.68rem; line-height:1.4; letter-spacing:.05em; transform:rotate(-12deg); box-shadow:0 14px 35px rgba(20,52,79,.08); }
.hero-stamp span { display:block; font-size:27px; line-height:1; }
.trust-strip { background:#14344f; border:0; }
.trust-item { border-color:rgba(255,255,255,.16); padding:27px 24px; }
.trust-item span { color:#d6f17b; font-size:1.08rem; font-family:var(--sans); font-weight:800; letter-spacing:.12em; }
.trust-item strong { color:white; font-weight:600; }
.trust-item small { color:#b9cbd1; }
.answer-card { border-radius:32px; }
.answer-card.image-backed { background-image:linear-gradient(90deg,rgba(255,254,250,.97),rgba(255,254,250,.87)),url('/assets/tourist-dental-consultation-v1.jpg'); box-shadow:none; }
.answer-card h2 { letter-spacing:-.035em; }
.answer-card.image-backed .answer-body { box-shadow:none; background:rgba(255,255,255,.75); }
.service-card { position:relative; min-height:345px; border:0; border-radius:26px; background:#eef4f1; overflow:hidden; }
.service-card.featured { color:#14344f; background:#deeee7; }
.service-card.featured:nth-child(2) { background:#edf2d7; }
.service-card.featured:nth-child(3) { background:#f4e4d5; }
.service-card.featured p { color:#405969; }
.service-card .index { width:52px; height:52px; display:grid; place-items:center; border:1px solid rgba(20,52,79,.18); border-radius:50%; color:#14344f; font-family:var(--sans); font-size:.9rem; }
.service-card h3 { margin-top:36px; font-size:1.85rem; line-height:1.2; letter-spacing:-.02em; }
.service-card p { font-size:.94rem; }
.service-card a { display:flex; justify-content:space-between; margin-top:auto; padding-top:22px; }
.service-card::after { content:'↗'; position:absolute; top:30px; right:27px; color:#14344f; font-size:26px; transition:transform .2s; }
.service-card:hover { transform:translateY(-6px); box-shadow:0 20px 35px rgba(20,52,79,.08); }
.service-card:hover::after { transform:translate(3px,-3px); }
.section-dark { background:#14344f; border-radius:36px 36px 0 0; }
.section-dark .eyebrow { color:#d6f17b; }
.journey article { border-color:rgba(255,255,255,.2); }
.journey .num { color:#d6f17b; }
.journey h3 { margin-top:38px; }
.credential-visual { border-radius:180px 28px 28px 28px; }
.credential-note { border-radius:18px; background:rgba(255,254,250,.94); }
.doctor-facts > div { border-radius:14px; }
.facility-card { min-height:380px; border-radius:28px; }
.facility-card img { transition:transform .7s ease; }
.facility-card:hover img { transform:scale(1.045); }
.facility-card figcaption { background:rgba(20,52,79,.9); }
.safety-copy { border-radius:26px; background:#14344f; }
.safety-image { border-radius:26px; overflow:hidden; }
.case-gallery { background:#102d40; border-radius:36px; margin:0 18px; padding:90px 0; }
.case-gallery .eyebrow { color:#d6f17b; }
.case-gallery-head h2 { letter-spacing:-.025em; }
.case-frame { border-radius:20px; }
.case-nav { color:#14344f; background:#d6f17b; border:0; }
.case-progress button.active { background:#d6f17b; }
.case-slide-head span { color:#d6f17b; }
.testimonial { border:0; border-radius:24px; background:white; padding:32px; box-shadow:0 14px 35px rgba(20,52,79,.04); }
.testimonial blockquote { font-size:1.3rem; }
.testimonial::before { content:'“'; display:block; color:#93b9ad; font-size:65px; font-family:var(--serif); line-height:.75; margin-bottom:18px; }
.faq-list details { margin-bottom:10px; padding:0 22px; border:1px solid var(--line); border-radius:18px; background:white; }
.faq-list details[open] { background:#edf7f4; }
.faq-list summary { font-family:var(--sans); font-size:1.02rem; }
.location-section { background:#14344f; margin-top:35px; border-radius:36px 36px 0 0; }
.location-block small { color:#c7d8df; }
.location-block p { color:#c0cfd5; }
.social-dock { width:76px; right:14px; filter:drop-shadow(0 12px 22px rgba(20,52,79,.1)); }
.social-dock-card { border-radius:22px; }
.social-dock-link { min-height:73px; gap:5px; padding:10px 5px; }
.social-dock-link svg { width:24px; height:24px; }
.social-dock-link strong { font-size:.57rem; }
.social-dock-link small { display:none; }
.social-book { min-height:64px; flex-direction:column; gap:2px; border-radius:19px; font-size:.62rem; background:#d6f17b; box-shadow:none; }
.social-book svg { width:20px; }
@media(min-width:1201px) { main .wrap { width:min(calc(100% - 190px),var(--max)); } }
@media(max-width:1200px) { .social-dock { display:none; } }
.site-footer { background:#102d40; }
.site-footer .brand { border-radius:20px; }
.contact-card { border-radius:23px; box-shadow:none; }
.contact-card:hover { background:#edf7f4; }
.travel-help { background:#f4e4d5; color:#14344f; }
.travel-help h2, .travel-help-copy { color:#14344f; }
.travel-help .eyebrow, .urgent-note { color:#52616a; }
.urgent-panel { background:#fffefa; border-color:rgba(20,52,79,.13); color:#14344f; }
.urgent-panel small, .urgent-checklist, .real-emergency p { color:#405969; }
.urgent-panel h3, .real-emergency strong { color:#14344f; }
.real-emergency { background:#f6f0e6; }
.urgent-badge { background:#fffefa; color:#8b392b; }
.button.urgent-call { color:#14344f; border-color:#14344f; background:transparent; }
.button.urgent-chat { color:white; background:#143e55; border-color:#143e55; }
.design-progress { position:fixed; z-index:99; top:0; left:0; height:3px; width:100%; background:#93b9ad; transform:scaleX(0); transform-origin:left; pointer-events:none; }
.visit-finder { padding:75px 0; background:#fffefa; }
.visit-finder-head { display:flex; justify-content:space-between; align-items:end; gap:30px; margin-bottom:28px; }
.visit-finder-head h2 { font-size:clamp(2rem,3.5vw,3.2rem); letter-spacing:-.035em; }
.visit-finder-head p { max-width:380px; color:#52616a; }
.visit-options { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.visit-option { display:flex; align-items:center; justify-content:space-between; text-align:left; padding:22px; gap:12px; border:1px solid var(--line); border-radius:18px; color:#14344f; background:white; cursor:pointer; transition:background .2s,transform .2s; font-weight:700; }
.visit-option:hover { transform:translateY(-3px); }
.visit-option[aria-pressed=true] { color:#14344f; background:#d6f17b; border-color:#b5d262; }
.visit-option span:last-child { width:28px; height:28px; display:grid; place-items:center; background:rgba(20,52,79,.07); border-radius:50%; }
.visit-result { display:grid; grid-template-columns:1fr auto; align-items:center; gap:32px; padding:28px 32px; margin-top:16px; border-radius:24px; background:#edf7f4; }
.visit-result h3 { font-size:1.55rem; margin:0; }
.visit-result p { margin:8px 0 0; max-width:700px; color:#405969; }
.visit-result-links { display:flex; flex-wrap:wrap; align-items:center; gap:15px; }
.visit-result-links > a:last-child { font-size:.86rem; }
.journal-hero { background:#e7f0e9; position:relative; overflow:hidden; }
.journal-hero::after { content:'✳'; position:absolute; right:6%; bottom:25px; font-size:170px; line-height:1; color:#aac9bb; opacity:.45; pointer-events:none; }
.journal-hero .wrap { position:relative; z-index:1; }
.journal-card { border:0; border-radius:24px; box-shadow:0 9px 32px rgba(20,52,79,.065); transition:transform .25s,box-shadow .25s; }
.journal-card:hover { transform:translateY(-5px); box-shadow:0 20px 40px rgba(20,52,79,.1); }
.journal-category { display:inline-block; width:fit-content; padding:5px 10px; border-radius:999px; background:#edf7f4; color:#32695b; }
.journal-filters button[aria-pressed=true] { color:#14344f; background:#d6f17b; border-color:#d6f17b; }
.journal-article-hero { background:#f5f2ea; }
.journal-answer { border-left-color:#93b9ad; }
.toc { border-radius:20px; background:#fffefa; }
.journal-contact { background:#e7f0e9; }
@media(min-width:1600px) { .hero-media { right:max(32px,calc((100vw - 1450px)/2)); } }
@media(max-width:1200px) { .hero-media { inset:24px 25px 30px 57%; } .hero-stamp { right:calc(43% - 42px); } .hero h1 { font-size:3.35rem; } .hero-sidecard { right:42px; } }
@media(max-width:980px) { .site-header .nav { height:76px; } .nav-links { inset:76px 0 auto; max-height:calc(100svh - 76px); overflow:auto; } .hero { min-height:710px; } .hero h1 { font-size:3.55rem; } .hero-stamp { display:none; } .hero-media { inset:24px 18px 28px 57%; border-radius:120px 24px 24px; } .hero-inner { padding:65px 0; } .hero-copy { max-width:49%; font-size:.97rem; } .hero-inner > * { max-width:51%; } .hero .hero-actions { flex-direction:column; align-items:start; } .visit-result { grid-template-columns:1fr; gap:22px; } .visit-options { grid-template-columns:repeat(2,1fr); } .visit-finder-head { align-items:start; flex-direction:column; } }
@media(max-width:680px) { .section { padding:68px 0; } .site-header .nav { height:72px; } .site-header .brand { height:44px; } .hero { min-height:0; padding-bottom:320px; } .hero-inner { width:calc(100% - 36px); padding:44px 0 38px; align-content:start; } .hero-inner > *, .hero-copy, .hero .eyebrow { max-width:100%; } .hero h1 { max-width:100%; font-size:clamp(2.55rem,10vw,3.7rem); line-height:1.1; letter-spacing:-.04em; } .hero-copy { font-size:.98rem; margin-top:20px; } .hero .hero-actions { flex-direction:row; align-items:stretch; } .hero .hero-actions .button { width:auto; flex:1; padding:13px 15px; font-size:.82rem; } .hero-media { inset:auto 18px 20px; height:285px; border-radius:85px 22px 22px; } .hero-media::after { background:linear-gradient(0deg,rgba(16,45,64,.1),transparent); } .hero-proof { display:flex; max-width:100%; margin-top:23px; } .hero-proof .pill { font-size:.62rem; padding:6px 9px; } .trust-item { padding:23px 15px; } .trust-item small { font-size:.72rem; } .trust-item strong { font-size:.78rem; } .trust-item:nth-child(-n+2) { border-bottom-color:rgba(255,255,255,.16); } .answer-card.image-backed { background-image:linear-gradient(rgba(255,254,250,.93),rgba(255,254,250,.9)),url('/assets/tourist-dental-consultation-v1.jpg'); } .service-card { min-height:300px; padding:26px; } .service-card h3 { font-size:1.65rem; } .credential-visual { border-radius:100px 24px 24px; } .case-gallery { margin:0 8px; padding:65px 0; border-radius:24px; } .visit-finder { padding:52px 0; } .visit-finder-head { gap:16px; } .visit-option { padding:17px 14px; font-size:.84rem; } .visit-result { padding:24px; } .journal-hero::after { right:-25px; font-size:100px; } .location-section { border-radius:25px 25px 0 0; } .nav-links { inset:72px 0 auto; } }
@media(prefers-reduced-motion:reduce) { *,*::before,*::after { animation:none !important; transition:none !important; } html { scroll-behavior:auto; } }