/* With You official site V2 – static, no framework / remote fonts */
:root{--cream:#fbf8f2;--white:#fff;--ink:#293c39;--muted:#63736d;--teal:#275d55;--teal-dark:#1d443f;--mint:#eaf1e9;--line:#e4e9df;--amber:#c87945;--amber-soft:#fff1df;--radius:22px;--shadow:0 22px 58px rgba(42,70,55,.09)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--cream);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;color:var(--ink);-webkit-font-smoothing:antialiased}img{max-width:100%;display:block}a{color:inherit;text-decoration:none}button{font:inherit}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid var(--amber);outline-offset:4px}p{line-height:1.85}h1,h2,h3{letter-spacing:-.035em;line-height:1.35}h1{font-size:clamp(38px,4.5vw,66px);margin:14px 0 24px}h2{font-size:clamp(29px,3.1vw,43px);margin:12px 0 14px}h3{font-size:21px;margin:0 0 12px}.wrap{width:min(1160px,calc(100% - 48px));margin-inline:auto}.section{padding:88px 0}.eyebrow{font-size:12px;letter-spacing:.2em;color:var(--amber);font-weight:850;text-transform:uppercase}.section-head{max-width:700px;margin:0 auto 42px;text-align:center}.section-head p{color:var(--muted);margin:0}.lead{font-size:18px;line-height:1.9;color:var(--muted);max-width:650px}.muted{color:var(--muted)}.site-header{height:86px;background:rgba(251,248,242,.92);position:sticky;top:0;z-index:50;border-bottom:1px solid rgba(64,92,82,.08);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.nav-inner{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:13px;white-space:nowrap}.brand-symbol{width:42px;height:42px;display:grid;place-items:center;border-radius:15px;background:var(--teal);color:white;font-size:22px;box-shadow:0 7px 17px rgba(39,93,85,.17)}.brand-words{display:flex;flex-direction:column;gap:1px;font-size:19px;font-weight:850;line-height:1.2;letter-spacing:.015em}.brand-words small{font-family:Georgia,serif;font-style:italic;letter-spacing:.05em;font-size:11px;color:var(--amber);font-weight:700}.desktop-nav{display:flex;align-items:center;gap:30px;font-size:14px;color:#526a62}.desktop-nav a:not(.btn):hover,.desktop-nav a[aria-current=page]{color:var(--teal);font-weight:750}.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;padding:13px 22px;border-radius:13px;font-size:14px;font-weight:760;border:1px solid transparent;transition:transform .2s,background .2s,box-shadow .2s}.btn:hover{transform:translateY(-2px)}.btn-primary{color:white;background:var(--teal);box-shadow:0 8px 18px rgba(39,93,85,.16)}.btn-primary:hover{background:var(--teal-dark)}.btn-light{border-color:var(--line);background:white;color:var(--teal)}.btn-outline{color:var(--teal);border-color:#b9d0c4;background:transparent}.btn-dark{background:#242827;color:white}.btn-green{background:#348e3b;color:white}.mobile-nav{display:none}.mobile-nav summary{cursor:pointer;list-style:none;font-size:14px;background:white;border:1px solid var(--line);padding:9px 13px;border-radius:10px}.mobile-nav summary::-webkit-details-marker{display:none}.mobile-nav[open] .mobile-items{position:absolute;left:20px;right:20px;top:74px;display:flex;flex-direction:column;gap:0;background:white;border-radius:16px;padding:10px;box-shadow:var(--shadow);border:1px solid var(--line)}.mobile-items a{padding:12px 14px;border-radius:9px}.mobile-items a:hover{background:var(--mint)}.hero{padding:70px 0 94px;position:relative;overflow:hidden}.hero:before{content:"";position:absolute;width:700px;height:700px;left:-360px;top:-380px;background:radial-gradient(circle,#ffe6c2,transparent 66%);pointer-events:none;opacity:.7}.hero-inner{display:grid;grid-template-columns:1.06fr .94fr;gap:70px;align-items:center}.hero h1 em{font-style:normal;color:var(--teal)}.hero h1 .warm{color:var(--amber)}.hero-ctas{display:flex;gap:13px;flex-wrap:wrap;margin-top:28px}.mini-facts{display:flex;flex-wrap:wrap;gap:15px 25px;margin-top:33px;font-size:13px;color:#67786f}.mini-facts span:before{content:"✓";color:#3f8d69;margin-right:7px;font-weight:900}.hero-visual{position:relative;min-height:570px;display:flex;align-items:center;justify-content:center}.hero-frame{position:relative;width:min(410px,90%);height:540px;border-radius:32px;overflow:hidden;box-shadow:0 38px 65px rgba(57,75,55,.18);transform:rotate(3deg);border:9px solid rgba(255,255,255,.9)}.hero-frame img{width:100%;height:100%;object-fit:cover;object-position:center 61%}.hero-frame:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,252,244,.25),transparent 25%,transparent 80%,rgba(70,47,27,.13));pointer-events:none}.floating-note{position:absolute;z-index:2;left:-15px;bottom:72px;background:white;border:1px solid rgba(220,227,213,.85);padding:18px 21px;border-radius:18px;box-shadow:var(--shadow);transform:rotate(-4deg);max-width:240px}.floating-note strong{font-size:16px}.floating-note p{font-size:12px;margin:6px 0 0;color:var(--muted);line-height:1.7}.floating-icon{position:absolute;right:0;top:74px;z-index:2;border-radius:18px;background:var(--amber-soft);padding:16px;font-size:28px;transform:rotate(10deg)}.band{background:#edf2e9;border-block:1px solid #e6ece1;padding:28px 0}.band-inner{display:flex;align-items:center;justify-content:center;gap:36px;flex-wrap:wrap;text-align:center;color:#547066;font-size:14px;font-weight:700}.band-inner .dot{color:#c6d3c7}.card-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.feature-card{background:white;border:1px solid #edf0e8;border-radius:22px;padding:30px;min-height:224px;box-shadow:0 8px 30px rgba(53,77,64,.035);transition:transform .2s,box-shadow .2s}.feature-card:hover{transform:translateY(-4px);box-shadow:var(--shadow)}.feature-icon{width:48px;height:48px;border-radius:15px;background:#eef4eb;display:grid;place-items:center;font-size:25px;margin-bottom:23px}.feature-card:nth-child(2) .feature-icon,.feature-card:nth-child(5) .feature-icon{background:#fff0e5}.feature-card p{font-size:14px;color:var(--muted);margin:0}.soft-section{background:#f0f3ed}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.split.reverse{direction:rtl}.split.reverse>*{direction:ltr}.image-stage{background:#e6efe7;border-radius:30px;padding:36px;position:relative;min-height:460px;display:flex;align-items:center;justify-content:center;overflow:hidden}.image-stage.orange{background:#f7eadd}.screen-frame{height:430px;max-width:230px;width:54%;border-radius:27px;overflow:hidden;background:#fff;border:6px solid #26312f;box-shadow:0 24px 35px rgba(35,55,44,.2)}.screen-frame img{width:100%;height:100%;object-fit:cover;object-position:top}.stage-label{position:absolute;bottom:24px;left:28px;background:white;padding:13px 17px;border-radius:12px;font-size:13px;font-weight:700;box-shadow:0 8px 22px rgba(0,0,0,.06)}.text-stack{display:flex;flex-direction:column;align-items:start;gap:16px}.text-stack h2,.text-stack p{margin:0}.tick-lines{display:grid;gap:13px;margin-top:12px}.tick-lines span{font-size:14px;color:#526b60}.tick-lines span:before{content:"✳";margin-right:10px;color:#6e9980}.shots-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}.shot{background:#fff;padding:16px;border-radius:22px;border:1px solid var(--line);box-shadow:0 10px 24px rgba(50,76,59,.04)}.shot-image{aspect-ratio:9/17;background:#f3f3ef;border-radius:14px;overflow:hidden}.shot-image img{width:100%;height:100%;object-fit:cover;object-position:top}.shot h3{font-size:16px;margin:15px 2px 5px}.shot p{font-size:12px;color:var(--muted);margin:0 2px 3px}.cta-panel{background:#214e46;color:white;padding:47px 55px;border-radius:27px;display:flex;justify-content:space-between;align-items:center;gap:40px;background-image:radial-gradient(circle at 90% 0,rgba(255,255,255,.12),transparent 40%)}.cta-panel h2{margin:0 0 10px}.cta-panel p{margin:0;color:#d3e3dc}.cta-panel .btn{background:white;color:#245b50;flex-shrink:0}.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.step{padding:28px;border-top:2px solid #bed4c6}.step-num{font:italic 38px Georgia,serif;color:var(--amber)}.step h3{margin:12px 0}.step p{font-size:14px;color:var(--muted);margin:0}.faq-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.faq-grid details{padding:20px 23px;border:1px solid var(--line);border-radius:15px;background:white}.faq-grid summary{font-weight:750;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:15px}.faq-grid summary:after{content:"＋";color:var(--teal)}.faq-grid details[open] summary:after{content:"−"}.faq-grid summary::-webkit-details-marker{display:none}.faq-grid p{font-size:14px;color:var(--muted);margin:12px 0 0}.page-hero{padding:72px 0 62px;background:linear-gradient(125deg,#f1f4e9 0%,#fff6eb 100%);border-bottom:1px solid #e6ebe1}.page-hero h1{font-size:clamp(37px,4.3vw,57px);margin:14px 0 17px}.page-hero p{max-width:700px;margin:0;color:var(--muted);font-size:17px}.prose{max-width:800px}.prose p{color:var(--muted)}.info-list{display:grid;gap:18px}.info-block{padding:26px 29px;border-radius:20px;border:1px solid var(--line);background:white}.info-block h3{margin:0 0 8px}.info-block p{margin:0;color:var(--muted);font-size:14px}.side-by-side{display:grid;grid-template-columns:1fr 1fr;gap:22px}.alert-note{padding:20px 23px;border-left:4px solid var(--amber);border-radius:8px;background:#fff7ed;font-size:14px;color:#73513d;line-height:1.8}.site-footer{background:#e9eee7;margin-top:40px;border-top:1px solid #dbe5da}.footer-top{padding:52px 0 31px;display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:45px}.footer-top p{color:#63766b;font-size:13px;max-width:360px}.footer-top h3{font-size:14px}.footer-links{display:grid;gap:13px;font-size:13px;color:#566e60}.footer-links a:hover{text-decoration:underline}.footer-bottom{border-top:1px solid #d2ddd0;padding:21px 0 30px;display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:#708274;font-size:12px}.footer-bottom a:hover{text-decoration:underline}.app-panel{display:grid;grid-template-columns:1.1fr .9fr;gap:45px;align-items:center;background:#e8efe7;border-radius:28px;padding:40px;overflow:hidden}.app-panel .poster-side{height:320px;position:relative;border-radius:20px;overflow:hidden}.app-panel .poster-side img{width:100%;height:100%;object-fit:cover;object-position:center 63%}.download-options{display:flex;gap:14px;flex-wrap:wrap;margin-top:24px}.app-panel p{color:var(--muted)}.pill{display:inline-flex;border:1px solid #c7d8ca;background:white;border-radius:99px;color:#527264;font-size:12px;padding:7px 13px}.contact-card{border:1px solid var(--line);background:white;border-radius:21px;padding:28px 34px}.contact-card a{color:var(--teal);text-decoration:underline;text-decoration-color:#a3c9b8;text-underline-offset:5px}.site-footer .brand-words small{color:#af713c}
@media(max-width:950px){.desktop-nav{gap:15px}.hero-inner{gap:25px}.hero-visual{min-height:500px}.hero-frame{height:460px}.split{gap:30px}.shots-grid{gap:10px}.shot{padding:10px}.footer-top{gap:20px}}
@media(max-width:760px){.wrap{width:min(100% - 32px,640px)}.site-header{height:70px}.brand-symbol{width:37px;height:37px;font-size:19px}.brand-words{font-size:16px}.desktop-nav{display:none}.mobile-nav{display:block}.hero{padding:45px 0 65px}.hero-inner,.split,.side-by-side,.app-panel{grid-template-columns:1fr}.hero h1{font-size:39px}.lead{font-size:16px}.hero-visual{min-height:440px;margin-top:20px}.hero-frame{height:420px;width:75%;transform:rotate(1deg)}.floating-note{left:0;bottom:25px}.floating-icon{right:3%;top:20px}.section{padding:62px 0}.card-grid{grid-template-columns:repeat(2,1fr);gap:12px}.feature-card{padding:22px;min-height:225px}.feature-card h3{font-size:17px}.feature-card p{font-size:13px}.split.reverse{direction:ltr}.image-stage{min-height:385px}.screen-frame{height:365px;width:190px}.shots-grid{grid-template-columns:repeat(2,1fr)}.cta-panel{padding:32px;align-items:flex-start;flex-direction:column;gap:20px}.steps{grid-template-columns:1fr;gap:0}.faq-grid{grid-template-columns:1fr}.page-hero{padding:50px 0}.app-panel{padding:23px}.footer-top{grid-template-columns:1fr 1fr;gap:25px}.footer-top>div:first-child{grid-column:1/-1}.footer-bottom{flex-direction:column;gap:10px}}
@media(max-width:420px){.hero h1{font-size:34px}.hero-visual{min-height:390px}.hero-frame{height:380px}.floating-note{max-width:200px;padding:14px}.feature-card{padding:18px;min-height:230px}.feature-icon{margin-bottom:15px}.mini-facts{gap:9px 15px}.btn{padding:12px 15px}.band-inner{gap:10px 15px;font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}