.green-screen-page{--navy: #12213e;--canvas: #f8fbf8;--green-ink: #41673c;--content-gutter: max(24px, calc((100vw - 1120px)/2) );color:var(--navy);background:#fff;font-family:Manrope,Arial,sans-serif}.green-screen-page :is(h1,h2,h3){text-wrap:balance}.green-screen-page :is(a,button,input):focus-visible{outline:3px solid var(--green-ink);outline-offset:4px}.green-screen-page .ad-banner{overflow:hidden}.green-hero{padding:64px 24px 30px;background:var(--canvas)}.green-hero__copy{max-width:890px;margin-inline:auto;text-align:center}.green-hero__assurances{display:flex;justify-content:center;flex-wrap:wrap;gap:12px 22px;margin:0 0 24px;color:var(--green-ink);font:600 12px/1.5 Manrope,sans-serif}.green-hero__assurances span{display:inline-flex;align-items:center;gap:7px}.green-hero__assurances span:before{content:"✓"}.green-hero h1{margin:0 0 24px;font:650 clamp(36px,4vw,58px)/1.06 "Bricolage Grotesque",sans-serif;letter-spacing:-.055em}.green-hero h1 em{display:block;color:var(--green-ink);font-style:normal}.green-hero__intro{max-width:760px;margin:0 auto 34px;color:#536681;font-size:15px;line-height:1.75}.green-workboard{max-width:1060px;margin-inline:auto;padding:12px;border:1px solid #ccdace;border-radius:20px;background:#fff;box-shadow:0 16px 48px #24492d0d;scroll-margin-top:90px}.green-workboard .color-workspace{border-radius:10px}.green-workboard .color-workspace__empty{min-height:270px;padding:30px 24px;background:#fff}.green-workboard .color-workspace__empty h2{max-width:600px;margin-bottom:18px;font-size:30px;letter-spacing:-.04em}.green-workboard .color-workspace__empty>span{margin-top:12px}.green-workboard .color-workspace__empty>button:not(.color-workspace__sample),.green-workboard .color-workspace__actions button:not(.color-workspace__secondary){background:var(--green-ink)}.green-workboard .color-workspace__empty>button:not(.color-workspace__sample):hover,.green-workboard .color-workspace__actions button:not(.color-workspace__secondary):hover{background:#31532d}.green-workboard .color-workspace__sample{display:inline-flex;align-items:center;gap:10px;margin-top:18px;padding:6px 14px 6px 6px;border:1px solid #d7e2d9;border-radius:10px;color:var(--navy);background:#f5faf5;font-size:12px;font-weight:600}.green-workboard .color-workspace__sample:hover:not(:disabled){background:#eaf4e9}.green-workboard .color-workspace__sample img{width:46px;height:38px;border-radius:5px;object-fit:cover}.green-workboard .color-workspace__canvas figure{height:260px}.green-workboard .color-workspace__empty .color-workspace__notice{max-width:55ch;margin:14px 0 0;color:#9c3824;font-size:13px;line-height:1.5}.green-workflow{padding-bottom:62px;background:#fffdf8}.green-screen-page .green-workflow .seo-workflow{padding-bottom:28px}.green-screen-page .workflow-explanation{max-width:720px;margin:14px auto 0;color:#536681;font-size:14px;line-height:1.65}.green-workflow__action{padding-inline:var(--content-gutter);text-align:center}.green-workflow__action p{margin:0 auto 18px;color:#536681;font-size:14px;line-height:1.65}.green-workflow__action a{display:inline-flex;gap:8px;align-items:center;padding:14px 22px;border-radius:999px;color:#fff;background:var(--navy);font:600 14px/1.4 Manrope,sans-serif}.green-workflow__action a:hover{background:var(--green-ink)}.green-screen-page .tool-section{--tool-section-gutter: var(--content-gutter)}.green-screen-page .image-text-comparison{padding-block:80px;gap:64px}.green-screen-page .image-text-comparison--reversed{background:#f0f6f2;grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.green-screen-page .image-text-comparison--compact__visual,.green-screen-page .image-text-comparison--reversed__visual{width:100%;max-width:460px;justify-self:center}.green-screen-page .image-text-comparison--tall{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.green-screen-page .image-text-comparison--tall__visual{width:100%;max-width:460px;justify-self:center}.green-screen-page .image-text-comparison h2{font-weight:600;font-size:clamp(32px,3.2vw,46px);line-height:1.08;letter-spacing:-.045em}.green-screen-page .image-text-comparison .comparison-cutout{background:var(--comparison-result-background)}.green-screen-page .why-section{--why-background: #f8fbf8}.green-screen-page .why-section__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:44px 36px}.green-screen-page .why-section__image{border-radius:10px;box-shadow:none}.green-screen-page .why-section__card h3{font-size:22px}.green-screen-page .audience-tabs{background:#fff}.green-screen-page .audience-tabs__tabs{background:#eef5ee}.green-screen-page .audience-tabs__tabs .is-active{background:var(--green-ink);color:#fff}.green-screen-page .audience-tabs__visual{height:320px;min-height:0;grid-template-rows:minmax(0,1fr)}.green-screen-page .audience-tabs__visual img{min-height:0;object-fit:contain;object-position:center;background:repeating-conic-gradient(#e1e7e3 0% 25%,#f5f8f5 0% 50%) 50% / 22px 22px}.green-screen-page .audience-tabs__visual--single{height:auto;aspect-ratio:8 / 5;grid-template-columns:1fr}.green-screen-page .audience-tabs__visual--single img{background:#f0f6f2}.green-screen-page .audience-tabs__copy>a{background:var(--navy)}.green-screen-page .audience-tabs__copy>a:hover{background:var(--green-ink)}.green-screen-page .preview-close{background:var(--green-ink)}.green-screen-page .tool-section.preview-close>div>a{color:var(--green-ink)}.green-related{padding:42px var(--content-gutter) 56px;background:#f8fbf8}.green-related h2{margin:0 0 20px;font:600 24px/1.25 Bricolage Grotesque,sans-serif;letter-spacing:-.025em}.green-related>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.green-related a{padding-top:16px;border-top:1px solid #ccdace}.green-related a>span{display:flex;justify-content:space-between;gap:14px;font-size:14px;font-weight:700}.green-related i{font-style:normal}.green-related p{margin:8px 0 0;color:#536681;font-size:13px;line-height:1.65}@media(min-width:901px){.green-screen-page .tool-section.preview-close{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(32px,4vw,64px);padding-inline:var(--content-gutter)}}@media(max-width:1100px){.green-screen-page{--content-gutter: 40px}.green-screen-page .image-text-comparison--compact{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.green-screen-page .image-text-comparison{gap:36px}.green-screen-page .why-section__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:36px}}@media(max-width:860px){.green-screen-page .image-text-comparison{grid-template-columns:1fr}.green-screen-page .image-text-comparison--reversed__visual{width:100%;max-width:460px;justify-self:center}}@media(max-width:760px){.green-screen-page{--content-gutter: 24px}.green-hero{padding-top:38px}.green-hero__intro{font-size:14px}.green-screen-page .image-text-comparison{padding-block:58px}.green-related>div{grid-template-columns:1fr}}@media(max-width:540px){.green-hero{padding-inline:16px}.green-hero__copy{padding-inline:8px}.green-hero h1{font-size:35px}.green-workboard{padding:7px;border-radius:15px}.green-workboard .color-workspace__empty{padding:28px 16px}.green-workboard .color-workspace__empty h2{font-size:27px}.green-workboard .color-workspace__canvas figure{height:215px}.green-screen-page .why-section__grid{grid-template-columns:1fr}.green-workflow__action a{max-width:100%}}@media(prefers-reduced-motion:reduce){html:has(.green-screen-page){scroll-behavior:auto}.green-screen-page *,.green-screen-page *:before,.green-screen-page *:after{transition:none!important;animation:none!important}}html[lang=ar] .green-screen-page .comparison-input,html[lang=ar] .green-screen-page .color-field__inputs input:first-child{direction:ltr}html[lang=ar] .green-screen-page .color-field__inputs input:first-child{text-align:left}html[lang=ar] .green-screen-page .seo-workflow-grid{list-style:none}@media(min-width:761px){html[lang=ar] .green-screen-page .workflow-card:not(:last-child):after{content:"←";right:auto;left:-33px}}@media(min-width:681px){html[lang=ar] .green-screen-page .color-workspace__arrow{transform:scaleX(-1)}}html[lang=th] .green-screen-page :is(h1,h2,h3){letter-spacing:normal;line-height:1.35}html[lang=th] .green-screen-page :is(.preview-label,.comparison-label,.color-field,.color-range,.color-output){letter-spacing:normal}html[lang=ko] .green-screen-page{word-break:keep-all;overflow-wrap:anywhere}