/* JYL v2 — warm editorial design, enhanced progressively. */
:root{--ink:#162c24;--paper:#f8f6ef;--green:#146844;--gold:#a98449;--ease:cubic-bezier(.2,.75,.25,1)}
body{background:var(--paper);-webkit-font-smoothing:antialiased}
::selection{background:#d3e4d0;color:#162c24}
.reading-progress{position:fixed;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,#bca36e,#1b8056);transform:scaleX(0);transform-origin:left;z-index:40;pointer-events:none}
.top{background:#fffdf3e8;backdrop-filter:blur(20px);transition:box-shadow .3s,background .3s}
.top.scrolled{background:#fffffff0;box-shadow:0 8px 35px #233e2810}
.brand img{mix-blend-mode:multiply}.links>a:not(.button){position:relative;padding:8px 0;color:#59665b;transition:color .2s}.links>a:not(.button):after{content:'';position:absolute;bottom:2px;left:0;right:0;height:2px;background:var(--green);transform:scaleX(0);transform-origin:left;transition:transform .3s}.links>a:hover:after,.links>a[aria-current]:after{transform:scaleX(1)}.links>a[aria-current]{color:var(--green)}
.button{border-radius:100px;box-shadow:0 5px 16px #14684410;position:relative;overflow:hidden;isolation:isolate;transition:background .3s,box-shadow .3s,transform .3s}.button:before{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 25%,#ffffff24 48%,transparent 70%);transform:translateX(-110%);transition:transform .65s;z-index:-1}.button:hover:before{transform:translateX(110%)}.button:hover{box-shadow:0 10px 24px #145b4422;transform:translateY(-3px)}.button .arrow{transition:transform .3s}.button:hover .arrow{transform:translate(3px,-3px)}.button.outline{box-shadow:none;border-color:#bdc7b7}.button.outline:hover{background:#e5eddf}
.hero{padding:80px 0 67px;background:radial-gradient(ellipse at 7% 18%,#dfebd36b,transparent 50%),radial-gradient(ellipse at 100% 100%,#ead7b34d,transparent 50%)}
.hero:before{content:'';position:absolute;width:540px;height:540px;border:1px solid #c5ceb13d;border-radius:50%;left:-370px;top:30px;pointer-events:none}.hero-grid{gap:60px}.hero .eyebrow{display:inline-flex;gap:9px;align-items:center;letter-spacing:1.7px;font-size:10px;margin-bottom:25px}.hero .eyebrow:before{content:'';width:7px;height:7px;background:var(--green);border-radius:50%;box-shadow:0 0 0 5px #dfe9d6}.hero h1{font-size:clamp(46px,4.7vw,65px);line-height:1.26;letter-spacing:-2.8px}.hero h1 span{position:relative;display:inline-block;padding-bottom:5px}.hero h1 span:after{content:'';position:absolute;height:8px;background:#baa16c50;bottom:5px;left:0;right:0;border-radius:50%;transform:rotate(-1.2deg);z-index:0}.hero .intro{font-size:14px;line-height:2.1;margin-top:27px;margin-bottom:28px}.hero .english{font-size:10px;letter-spacing:3.1px;color:#697c67}
.visual{padding:22px 0 42px;isolation:isolate}.visual:before{content:'';position:absolute;inset:0 -17px 21px 43px;border:1px solid #c3b58a;border-radius:200px 16px 105px 16px;transform:rotate(3deg);z-index:-1}.scene{height:482px;object-position:center;filter:brightness(.77) saturate(.85);border-radius:190px 12px 90px 12px;box-shadow:0 28px 65px #1c352526}.visual-note{right:31px;bottom:95px;font-size:19px;text-shadow:0 3px 15px #0008}.scene-label{right:25px;top:80px;font-size:9px}.portrait-card{width:180px;left:-28px;bottom:3px;border:8px solid #fffdf7;border-radius:90px 90px 12px 12px;box-shadow:0 20px 40px #17392722;overflow:hidden;transform:rotate(-3deg)}.portrait-card img{height:209px;border-radius:80px 80px 3px 3px}.portrait-card figcaption{background:#fffdf7;padding:10px 0 3px}.portrait-card strong{letter-spacing:.3px}.portrait-card:after{content:'';position:absolute;inset:0;border-radius:inherit;border:1px solid #d4d7c6;pointer-events:none}
.hero-badge{position:absolute;right:-15px;top:-1px;border:1px solid #d7ddcb;background:#fffdf5;box-shadow:0 12px 30px #243a2410;border-radius:100px;padding:12px 18px;display:flex;align-items:center;gap:10px;font-size:11px;font-weight:700;letter-spacing:.2px}.hero-badge i{font-style:normal;width:28px;height:28px;border-radius:50%;background:#e6efdf;color:var(--green);display:grid;place-items:center;font-size:16px}
.scroll-cue{display:flex;gap:12px;align-items:center;color:#77816c;font-size:9px;letter-spacing:2px;margin:25px 0 0}.scroll-cue i{display:block;width:16px;height:27px;border:1px solid #a6b59b;border-radius:20px;position:relative}.scroll-cue i:before{content:'';position:absolute;left:6px;top:6px;width:2px;height:5px;border-radius:2px;background:var(--green)}
.locations{padding:24px 0;border-color:#d5dbcb;font-size:10px}.locations strong:before{content:'✦';color:var(--gold);margin-right:10px}
.section{padding:96px 0}.section h2{font-size:36px;letter-spacing:-1px}.section-head{margin-bottom:40px}.section-head>p{line-height:1.95}.eyebrow{font-size:10px;letter-spacing:2.1px}
.audiences{gap:23px}.audience{position:relative;overflow:hidden;border:1px solid #dedfd1;border-radius:15px;background:linear-gradient(150deg,#fffef9,#f1f2e8);padding:32px 27px;box-shadow:0 4px 20px #233a2703;transition:transform .45s var(--ease),box-shadow .45s,border-color .45s}.audience:before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 95% 0%,#cbdcba65,transparent 65%);opacity:0;transition:opacity .4s;pointer-events:none}.audience:hover{transform:translateY(-9px);box-shadow:0 22px 45px #263f2410;border-color:#9dae8e}.audience:hover:before{opacity:1}.audience h3{margin-top:23px;font-size:25px}.audience .number{font-size:9px;letter-spacing:1.8px}.audience p{line-height:2.05;margin-bottom:28px}.audience .textlink{width:100%;justify-content:space-between;border-color:#cbd4bf;padding-bottom:9px}.textlink span{transition:transform .25s}.textlink:hover span{transform:translate(3px,-3px)}
.audience-icon{width:48px;height:48px;border-radius:13px;margin:25px 0 0;display:grid;place-items:center;background:#e4eadb;color:#4b6c48;border:1px solid #d5ddc9}.audience-icon svg{height:25px;width:25px;stroke:currentColor;stroke-width:1.4;fill:none;stroke-linejoin:round;stroke-linecap:round}.audience:nth-child(2) .audience-icon{background:#f1e8d5;border-color:#e6dbc2;color:#997a45}.audience:nth-child(3) .audience-icon{background:#e2e9e5;border-color:#d0dbd4;color:#507567}
.services{position:relative;overflow:hidden;background:linear-gradient(115deg,#142f25,#20392b 60%,#2e422b)}.services:after{content:'';position:absolute;right:-175px;top:-180px;width:590px;height:590px;border:1px solid #b9d29d18;border-radius:50%;box-shadow:0 0 0 70px #b9d29d07,0 0 0 140px #b9d29d05;pointer-events:none}.service-grid{position:relative;z-index:1}.services h2{font-size:42px;line-height:1.5}.service-main{border-color:#6f855b}.service-main .tag{background:#c9d8b83b;border:1px solid #849875;color:#d6e4c6;border-radius:100px;padding:6px 12px}.service-main h3{font-size:31px;margin-top:22px}.service-row{transition:padding .3s,color .3s}.service-row:hover{padding-left:10px;color:#d1c398}.service-foot{line-height:1.9}
.step{padding:27px 0 0;border-color:#cad3bd}.step:before{content:'';position:absolute;left:0;top:-4px;width:7px;height:7px;background:var(--gold);border-radius:50%;box-shadow:0 0 0 6px var(--paper)}.step-no{font-style:italic}.step h3{margin-top:23px}.process-bottom{border-radius:0 8px 8px 0;background:#eaf0e1}
.faq-section{padding-top:0}.faq summary{padding:24px 0;transition:color .2s}.faq summary:hover{color:var(--green)}.faq details[open]{background:#edf1e5}.faq details[open] summary,.faq details[open] p{padding-left:17px;padding-right:17px}.faq details{transition:background .3s}.faq details[open] p{animation:answer-in .35s ease}.contact{background:radial-gradient(ellipse at 10% 70%,#d3e2c4,transparent 70%),#e7eddf;position:relative;border-top:1px solid #d5deca;padding:78px 0}.contact h2{font-size:41px}.form-panel{border:1px solid #d2dbc6;box-shadow:0 18px 55px #2846220c;border-radius:17px;padding:34px}.form-panel input,.form-panel select{border-color:#d9dfcf;border-radius:7px;transition:border-color .2s,box-shadow .2s}.form-panel input:focus,.form-panel select:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px #dcebd6}.contact .phone{display:inline-block;margin-top:5px;letter-spacing:1px}.footer{background:#fffdf7}
/* Content remains visible if animation support or scripts are unavailable. */
.motion-ready .reveal{opacity:0;transform:translateY(25px);transition:opacity .85s var(--ease),transform .85s var(--ease);transition-delay:var(--delay,0ms)}.motion-ready .reveal.is-visible{opacity:1;transform:translateY(0)}.hero-enter{animation:hero-in .9s var(--ease) both;animation-delay:var(--enter-delay,0ms)}
@keyframes hero-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes answer-in{from{opacity:0;transform:translateY(-5px)}to{opacity:1;transform:translateY(0)}}@keyframes gentle-float{0%,100%{translate:0 0}50%{translate:0 -8px}}@keyframes scroll-dot{0%,100%{transform:translateY(0);opacity:.5}50%{transform:translateY(7px);opacity:1}}
@media(prefers-reduced-motion:no-preference){.hero-badge{animation:gentle-float 5s ease-in-out infinite}.scroll-cue i:before{animation:scroll-dot 2s ease-in-out infinite}}
@media(max-width:980px){.hero{padding:55px 0}.hero-grid{gap:40px}.hero h1{font-size:46px}.scene{height:445px}.portrait-card{width:148px;left:-17px}.portrait-card img{height:180px}.hero-badge{font-size:9px;right:-7px;padding:10px 12px}.visual-note{font-size:16px;right:20px}.section h2{font-size:31px}.services h2{font-size:36px}}
@media(max-width:680px){.hero{padding:37px 0 32px}.hero .eyebrow{font-size:8px;letter-spacing:1.3px;margin-bottom:24px}.hero-grid{gap:33px}.hero h1{font-size:clamp(36px,10.7vw,49px);letter-spacing:-2px}.hero h1 span:after{height:6px;bottom:3px}.hero .intro{margin:23px 0;font-size:13px}.hero .english{font-size:8px;letter-spacing:2.5px}.hero .actions{gap:9px}.hero .actions .button{font-size:11px;padding:14px 15px}.hero-note{font-size:10px}.scroll-cue{margin-top:24px;font-size:8px}.visual{padding:20px 5px 32px 26px;margin:0 3px}.visual:before{inset:5px -5px 17px 45px;border-radius:140px 12px 70px 12px}.scene{height:337px;border-radius:130px 10px 65px 10px}.portrait-card{width:138px;left:-3px;bottom:0}.portrait-card img{height:164px}.hero-badge{right:-5px;top:0;font-size:9px}.hero-badge i{width:24px;height:24px}.visual-note{font-size:15px;bottom:76px;right:21px}.scene-label{font-size:7px;top:81px;right:18px}.section{padding:58px 0}.section h2{font-size:28px}.section-head{margin-bottom:27px}.audiences{gap:17px}.audience{padding:26px}.audience-icon{position:absolute;right:25px;top:22px;margin:0;width:43px;height:43px}.audience h3{font-size:24px;margin-top:30px}.audience .number{font-size:8px}.audience p{font-size:13px}.services h2{font-size:33px}.service-main h3{font-size:27px}.faq-section{padding-top:0}.contact{padding:48px 0}.contact h2{font-size:31px}.form-panel{padding:24px}.mobile-cta{background:#fffef5ed;backdrop-filter:blur(16px)}.step h3{font-size:16px}.step-no{font-size:32px!important}}
.motion-ready .reveal:focus-within{opacity:1;transform:none;transition-delay:0ms}
@media(hover:hover) and (prefers-reduced-motion:no-preference){.motion-ready .audience.is-visible:hover{transform:translateY(-9px)}}
@media(prefers-reduced-motion:reduce){.hero-enter,.hero-badge,.scroll-cue i:before,.faq details[open] p{animation:none!important}.motion-ready .reveal{opacity:1;transform:none}.audience:hover,.button:hover{transform:none}.reading-progress{display:none}}
