.sender-guide-container{max-width:1152px;margin-inline:auto}.landing-frame>.sender-guide-hero{padding:144px 48px 64px}.landing-frame>.sender-guide-section{padding:56px 48px}.sender-guide-hero-grid{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);align-items:center;gap:64px;display:grid}.sender-guide-columns{grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:start;gap:56px;display:grid}.sender-guide-title{letter-spacing:-.035em;margin-top:16px;font-size:clamp(24px,3vw,34px);font-weight:600;line-height:1.2}.sender-guide-description{color:#5e6e68;margin-top:16px;font-size:15px;line-height:1.8}.dark .sender-guide-description{color:#b2c0bc}.sender-message-preview,.sender-guide-panel{border:1px solid var(--landing-line,#deddd4);background:color-mix(in srgb,#087e82 3%,var(--landing-paper,#f6f4ee));border-radius:14px;min-width:0;padding:24px}.sender-guide-icon{color:#087e82;background:#087e8212;border-radius:12px;place-items:center;width:40px;height:40px;display:grid}.sender-message-bubble{background:#087e8210;border-radius:3px 14px 14px;margin-top:22px;padding:18px;font-size:15px;line-height:1.8}.sender-guide-print{color:inherit;border:1px solid var(--landing-line,#deddd4);cursor:pointer;background:0 0;border-radius:8px;align-items:center;gap:8px;padding:12px 16px;font-size:13px;display:inline-flex}.sender-guide-print:hover{background:#087e820a}.sender-guide-checks{gap:14px;margin-top:24px;padding:0;list-style:none;display:grid}.sender-guide-checks li{align-items:start;gap:10px;font-size:14px;line-height:1.7;display:flex}.sender-guide-checks svg{color:#087e82;flex-shrink:0;margin-top:4px}.sender-guide-input{border:1px solid var(--landing-line,#deddd4);background:var(--landing-paper,#f6f4ee);letter-spacing:.035em;border-radius:8px;width:100%;min-width:0;padding:12px;font:16px ui-monospace,monospace}.sender-guide-input:focus-visible{outline-offset:2px;outline:2px solid #087e82}.sender-guide-name-preview{border-top:1px solid var(--landing-line,#deddd4);margin-top:20px;padding-top:16px}.sender-guide-example-tabs{flex-wrap:wrap;gap:6px;margin-top:24px;display:flex}.sender-guide-example-tabs button{color:inherit;border:1px solid var(--landing-line,#deddd4);cursor:pointer;background:0 0;border-radius:8px;padding:9px 13px;font-size:12px}.sender-guide-example-tabs button[aria-pressed=true]{color:#087e82;background:#087e8212;border-color:#087e8266}.sender-guide-example-tabs button:focus-visible{outline-offset:2px;outline:2px solid #087e82}.sender-guide-examples{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px;margin-top:16px;display:grid}.sender-example-label{color:#087e82;align-items:center;gap:8px;font-size:12px;font-weight:600;display:flex}.sender-example-avoid{color:#9c5d2a}.sender-example-text{overflow-wrap:anywhere;margin-top:16px;font-size:15px;line-height:1.8}.sender-guide-steps{grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:28px;padding:0;list-style:none;display:grid}.sender-guide-steps li{border-top:1px solid var(--landing-line,#deddd4);min-width:0;padding-top:20px}.sender-guide-step-number{color:#087e82;font:12px ui-monospace,monospace}.sender-guide-note{background:#087e8208;border-left:3px solid #087e82;align-items:start;gap:12px;margin-top:28px;padding:18px;font-size:13px;line-height:1.8;display:flex}.sender-guide-note svg{color:#087e82;flex-shrink:0;margin-top:3px}.sender-guide-faq{min-width:0}.sender-guide-faq details{border-bottom:1px solid var(--landing-line,#deddd4);padding:18px 0}.sender-guide-faq details:first-child{padding-top:0}.sender-guide-faq summary{cursor:pointer;font-size:14px;font-weight:600;line-height:1.7}.sender-guide-faq details p{color:#5e6e68;margin-top:12px;font-size:13px;line-height:1.9}.dark .sender-guide-faq details p{color:#b2c0bc}.dark .sender-guide :is(.sender-guide-panel,.sender-message-preview){background:#10232a}.dark .sender-guide-input{color:#edf4f3;background:#0c1c23}.dark .sender-guide :is(.sender-guide-icon,.sender-example-label,.sender-guide-step-number,.sender-guide-checks svg),.dark .sender-guide-example-tabs button[aria-pressed=true]{color:#71d2cd}.dark .sender-example-avoid{color:#e5b98f}@media (max-width:767px){.landing-frame>.sender-guide-hero{padding:112px 24px 40px}.landing-frame>.sender-guide-section{padding:40px 24px}.sender-guide-hero-grid,.sender-guide-columns,.sender-guide-examples,.sender-guide-steps{grid-template-columns:minmax(0,1fr);gap:24px}.sender-guide-panel,.sender-message-preview{padding:20px}}@media print{.landing-frame>.sender-guide-hero,.landing-frame>.sender-guide-section{padding:16px 0!important}.sender-guide-hero-grid,.sender-guide-columns{grid-template-columns:minmax(0,1fr);gap:16px}.sender-guide-hero h1{font-size:28px!important}.sender-guide-title{font-size:21px}.sender-guide :is(p,li){font-size:11px!important;line-height:1.6!important}.sender-guide-panel,.sender-message-preview{padding:14px;background:#fff!important}.sender-guide-faq details p{display:block}.sender-guide input{color:#000;background:#fff}.sender-guide-steps{gap:16px}.sender-guide-print{display:none!important}.sender-guide :is(p,li,summary,label,span,strong,input,h1,h2,h3){color:#0f172a!important}}.sender-guide-phone{height:500px;margin-top:12px;position:relative;overflow:hidden}.sender-guide-phone .hero-phone-scene{transform-origin:top;width:304px;min-height:604px;margin:0;position:absolute;top:8px;left:50%;transform:translate(-50%)scale(.8)}.sender-guide-phone :is(.hero-phone-glow,.hero-phone-shadow){display:none}.sender-guide-phone :is(.hero-phone-device,.hero-phone-notification){animation:none;transform:none}.sender-guide-phone .hero-phone-notification strong{overflow-wrap:anywhere;min-width:0;font-size:16px}.sender-guide-phone .hero-phone-notification p{font-size:14px}@media (max-width:640px){.sender-guide-phone{height:450px}.sender-guide-phone .hero-phone-scene{transform:translate(-50%)scale(.72)}}@media print{.sender-guide-phone{height:320px}.sender-guide-phone .hero-phone-scene{transform:translate(-50%)scale(.5)}.sender-guide-phone .hero-phone-notification strong{color:#111113!important}.sender-guide-phone .hero-phone-lock :is(strong,span),.sender-guide-phone .hero-phone-status span{color:#d5d5d8!important}}
