/* Native Bricks content for the approved Websites page. */
.inlife-websites .wd-box { display:block; width:100%; max-width:none; min-width:0; }
.inlife-websites .wd-shell { display:block; width:min(var(--inlife-shell),calc(100% - (var(--inlife-gutter) * 2))); margin-inline:auto; }
.inlife-websites .wd-space { padding:100px 0; }
.inlife-websites .wd-copy { font-size:clamp(16px,1.45vw,23px); line-height:1.55; color:#7a858e; }
.inlife-websites .wd-small { font-size:clamp(12px,1.1vw,17px); line-height:1.6; color:#77838c; }
.inlife-websites .wd-actions { display:flex; flex-flow:row wrap; align-items:center; gap:28px; }
.inlife-websites .wd-link { display:inline-flex; width:auto; padding:0 0 4px; min-height:0; border:0; border-radius:0; color:var(--inlife-action); background:transparent; font-size:clamp(13px,1.15vw,18px); line-height:1.5; font-weight:700; cursor:pointer; text-decoration:underline; text-underline-offset:6px; }
.inlife-websites .wd-link:hover { color:var(--inlife-ink); background:transparent; }
.inlife-websites .wd-link.inlife-has-arrow::after { width:16px; height:16px; }
.inlife-websites .wd-section-head { display:grid; grid-template-columns:1.2fr 1fr; align-items:end; gap:9%; }
.inlife-websites .wd-section-intro .wd-link { margin-top:24px; }
.inlife-websites .inlife-eyebrow { font-size:clamp(9px,.75vw,12px); letter-spacing:.17em; }
.inlife-websites .inlife-heading { font-size:clamp(38px,4vw,64px); line-height:1.12; letter-spacing:-.052em; }
.inlife-websites :is(.wd-link,.wd-round,.wd-project-track,.wd-faq-summary,.wd-guide-form input):focus-visible { outline:3px solid var(--inlife-action); outline-offset:5px; }
/* Hero: the device frames deliberately extend across the smooth lower edge. */
.inlife-websites .wd-hero { position:relative; width:100%; padding:160px 0 100px; isolation:isolate; background:var(--inlife-dark); color:white; }
.inlife-websites .wd-hero::before { content:''; position:absolute; inset:0; z-index:-1; background:radial-gradient(ellipse at 84% 45%,#dc294b21,transparent 53%); }
.inlife-websites .wd-hero::after { content:''; position:absolute; bottom:-1px; left:0; width:100%; height:140px; z-index:1; pointer-events:none; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 230' preserveAspectRatio='none'%3E%3Cpath fill='%23fff' d='M0 90L1180 217.833C1320 233 1490 170 1600 22V230H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; }
.inlife-websites .wd-hero-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:25px; }
.inlife-websites .wd-hero-copy { padding-bottom:36px; }
.inlife-websites .wd-hero-copy .inlife-eyebrow { color:#b4c0c9; margin-bottom:30px; }
.inlife-websites .wd-title { font-size:clamp(56px,6.15vw,99px); line-height:1.09; letter-spacing:-.059em; font-weight:800; color:#fff; }
.inlife-websites .wd-title .accent { color:var(--inlife-red); }
.inlife-websites .wd-hero-subtitle { margin-top:40px; color:white; font-size:clamp(20px,1.94vw,31px); font-weight:700; letter-spacing:-.025em; }
.inlife-websites .wd-hero-copy .wd-copy { margin-top:26px; max-width:600px; color:#b8c5ce; }
.inlife-websites .wd-hero-copy .wd-actions { margin-top:42px; gap:32px; }
.inlife-websites .wd-hero-copy .wd-link { color:white; font-size:15px; }
.inlife-websites .wd-signoff { display:flex; gap:15px; align-items:center; margin-top:40px; color:#a4b4bf; font-size:clamp(10px,1vw,16px); line-height:1.5; }
.inlife-websites .wd-signoff::before { content:''; flex:0 0 24px; height:2px; background:var(--inlife-red); }
.inlife-websites .wd-hero-art { position:relative; aspect-ratio:1.02; isolation:isolate; }
.inlife-websites .wd-orbit { position:absolute; z-index:-1; top:5%; right:-10%; width:86%; aspect-ratio:1; border-radius:50%; background:var(--inlife-red); box-shadow:0 0 130px #e52a4b1a; }
.inlife-websites .wd-orbit::before,.inlife-websites .wd-orbit::after { content:''; position:absolute; inset:-6%; border:1px solid #f06b8140; border-radius:50%; }
.inlife-websites .wd-orbit::after { inset:-12%; border-color:#f06b8120; }
.inlife-websites .wd-browser { border:1px solid #9daab4; padding:0 5px 5px; background:#fff; border-radius:15px; overflow:hidden; box-shadow:0 18px 40px #0c172533; }
.inlife-websites .wd-browser-bar { position:relative; display:flex; align-items:center; gap:5px; height:26px; padding-left:8px; }
.inlife-websites .wd-browser-bar i { width:5px; height:5px; flex:0 0 5px; border-radius:50%; background:#f65a73; }
.inlife-websites .wd-browser-bar i:nth-child(2) { background:#e4b459; }.inlife-websites .wd-browser-bar i:nth-child(3) { background:#67d1a1; }
.inlife-websites .wd-browser-bar span { position:absolute; left:28%; top:6px; display:block; width:50%; height:14px; border-radius:4px; background:#edf1f3; color:#70818c; text-align:center; font-size:7px; line-height:14px; }
.inlife-websites .wd-browser-screen { display:block; width:100%; aspect-ratio:1.5; object-fit:cover; object-position:top; border-radius:5px; }
.inlife-websites .wd-browser-dark { background:#263642; }.inlife-websites .wd-browser-dark .wd-browser-bar span { background:#17252e; color:#b4c4cc; }
.inlife-websites .wd-hero-rear { position:absolute; top:-1%; right:3%; width:56%; transform:rotate(8deg); animation:wd-float-rear 8s ease-in-out infinite; }
.inlife-websites .wd-hero-main { position:absolute; top:26%; left:-1%; width:97%; transform:rotate(-7deg); animation:wd-float-main 9s ease-in-out infinite; }
.inlife-websites .wd-phone { position:absolute; z-index:3; right:-1%; top:72%; width:23%; aspect-ratio:.465; padding:6px; border:2px solid #6d7f8a; border-radius:25px; background:#0c151d; box-shadow:0 15px 20px #0004; transform:rotate(7deg); animation:wd-float-phone 7s ease-in-out infinite; }
.inlife-websites .wd-phone img { width:100%; height:100%; object-fit:cover; object-position:top; border-radius:17px; }
.inlife-websites .wd-phone::after { content:''; position:absolute; top:9px; left:35%; width:30%; height:8px; border-radius:9px; background:#0c151d; }
.inlife-websites .wd-hero-badge { position:absolute; z-index:2; top:93%; left:11%; width:52%; padding:19px 14px; background:#fff; color:var(--inlife-ink); border-radius:11px; box-shadow:0 10px 24px #07152118; font-size:clamp(7px,.65vw,10px); font-weight:800; letter-spacing:.1em; text-align:center; }
.inlife-websites .wd-hero-badge::before { content:''; display:inline-block; width:9px; height:9px; border-radius:50%; background:var(--inlife-mint); margin-right:12px; }
@keyframes wd-float-main { 50%{transform:translateY(-9px) rotate(-6deg)} }
@keyframes wd-float-rear { 50%{transform:translateY(8px) rotate(9deg)} }
@keyframes wd-float-phone { 50%{transform:translateY(-6px) rotate(6deg)} }
.inlife-websites .wd-art-paused :is(.wd-hero-main,.wd-hero-rear,.wd-phone) { animation-play-state:paused; }
/* Benefits and selected work. */
.inlife-websites .wd-benefits { padding-top:90px; }
.inlife-websites .wd-benefit-grid { display:grid; align-items:stretch; grid-template-columns:repeat(3,minmax(0,1fr)); gap:46px 54px; margin-top:85px; }
.inlife-websites .wd-benefit { padding-bottom:25px; border-bottom:1px solid var(--inlife-line); }
.inlife-websites .wd-number { font-size:13px; color:var(--inlife-action); font-weight:700; margin-bottom:19px; }
.inlife-websites .wd-benefit h3 { margin-bottom:12px; font-size:clamp(18px,1.6vw,26px); letter-spacing:-.04em; font-weight:800; }
.inlife-websites .wd-benefit .wd-copy { font-size:clamp(15px,1.3vw,21px); }
.inlife-websites .wd-portfolio,.inlife-websites .wd-people,.inlife-websites .wd-local { background:#f5f6f7; }
.inlife-websites .wd-project-track { --wd-gap:36px; display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:flex-start; gap:var(--wd-gap); width:100%; overflow-x:auto; overscroll-behavior-x:contain; scroll-snap-type:x mandatory; scrollbar-width:none; margin-top:60px; padding:0 0 10px; cursor:grab; }
.inlife-websites .wd-project-track::-webkit-scrollbar { display:none; }
.inlife-websites .wd-project-track.wd-dragging { cursor:grabbing; scroll-snap-type:none; user-select:none; }
.inlife-websites .wd-project-track.wd-resetting { scroll-snap-type:none; }
.inlife-websites .wd-project-card { flex:0 0 calc((100% - 2 * var(--wd-gap))/2.5); scroll-snap-align:start; }
.inlife-websites .wd-project-media { position:relative; display:flex; align-items:center; aspect-ratio:1.36; padding:24px; border-radius:20px; background:#e9edef; overflow:hidden; isolation:isolate; }
.inlife-websites .wd-project-media::after { content:''; position:absolute; width:66%; aspect-ratio:1; border:1px solid #d2dade; border-radius:50%; right:-25%; bottom:-40%; background:#dce4e8; z-index:-1; box-shadow:0 0 0 12px #dce4e840; }
.inlife-websites .wd-project-browser { width:100%; border-radius:10px; box-shadow:0 10px 18px #192b3620; }
.inlife-websites .wd-project-presentation { width:100%; border-radius:8px; }
.inlife-websites .wd-project-info { display:grid; grid-template-columns:1fr auto; align-items:start; gap:16px 12px; padding-top:25px; }
.inlife-websites .wd-project-info h3 { font-size:clamp(18px,1.75vw,28px); font-weight:800; letter-spacing:-.04em; }
.inlife-websites .wd-project-info .wd-copy { grid-column:1/-1; font-size:clamp(13px,1.1vw,18px); }
.inlife-websites .wd-project-open { padding-top:3px; font-size:clamp(11px,1vw,16px); white-space:nowrap; }
.inlife-websites .wd-carousel-controls { display:flex; flex-direction:row; flex-wrap:nowrap; align-items:center; gap:50px; margin-top:50px; }
.inlife-websites .wd-project-count { width:80px; flex-shrink:0; font-size:18px; color:#7d8992; white-space:nowrap; }.inlife-websites .wd-project-count strong { font-size:22px; margin-right:5px; color:var(--inlife-ink); }
.inlife-websites .wd-progress { height:3px; background:#e0e5e8; }.inlife-websites .wd-progress-fill { margin:0; width:33.3333%; height:100%; background:var(--inlife-red); transition:transform .25s ease; }
.inlife-websites .wd-arrows { display:flex; flex-wrap:nowrap; width:auto; flex-shrink:0; flex-direction:row; gap:20px; }
.inlife-websites .wd-round { position:relative; display:grid; place-items:center; width:56px; height:56px; min-height:0; flex:0 0 56px; padding:0; border:1px solid #cad3d9; border-radius:50%; background:#fff; color:var(--inlife-ink); font-size:0; cursor:pointer; transition:background .2s,color .2s,transform .2s; }
.inlife-websites .wd-round::after { content:''; position:absolute; inset:0; margin:auto; display:block; width:24px; height:24px; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16m-6-6 6 6-6 6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 12h16m-6-6 6 6-6 6' fill='none' stroke='black' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; }
.inlife-websites .wd-project-prev::after,.inlife-websites .wd-review-prev::after { transform:rotate(180deg); }
.inlife-websites .wd-project-next { color:#fff; background:var(--inlife-action); border-color:var(--inlife-action); }
.inlife-websites .wd-round:hover { transform:translateY(-2px); color:white; background:var(--inlife-ink); }.inlife-websites .wd-round:disabled { opacity:.35; cursor:default; transform:none; }
.inlife-websites .wd-track-hint { font-size:13px; margin-top:18px; color:#7d8992; }
/* Pricing and the booklet. */
.inlife-websites .wd-options .wd-section-head { grid-template-columns:1.65fr .75fr; gap:4%; }
.inlife-websites .wd-options .inlife-heading { font-size:clamp(36px,3.75vw,60px); }
.inlife-websites .wd-packages { display:grid; align-items:stretch; grid-template-columns:1fr 1fr; gap:44px; margin-top:60px; }
.inlife-websites .wd-package { display:flex; flex-direction:column; align-items:flex-start; padding:44px; background:#f5f6f7; border:1px solid var(--inlife-line); border-top:6px solid var(--inlife-red); border-radius:20px; }
.inlife-websites .wd-package h3 { margin-bottom:25px; font-size:clamp(29px,2.7vw,43px); font-weight:800; letter-spacing:-.05em; }
.inlife-websites .wd-price { display:flex; gap:15px; align-items:baseline; font-size:18px; line-height:1.3; }.inlife-websites .wd-price strong { font-size:clamp(48px,4.25vw,68px); line-height:1; letter-spacing:-.04em; }.inlife-websites .wd-price span { color:#71808b; }
.inlife-websites .wd-price-terms { margin-top:22px; font-size:clamp(12px,1.1vw,18px); font-weight:600; line-height:1.6; }
.inlife-websites .wd-checks { display:flex; gap:17px; flex-direction:column; margin:35px 0 38px; }
.inlife-websites .wd-checks > * { display:flex; gap:15px; align-items:baseline; font-size:clamp(14px,1.3vw,20px); line-height:1.5; }
.inlife-websites .wd-checks > *::before { content:'✓'; display:grid; place-items:center; flex:0 0 18px; height:18px; border-radius:50%; color:var(--inlife-action); background:#fee5eb; font-size:11px; font-weight:800; }
.inlife-websites .wd-package > .inlife-button,.inlife-websites .wd-package > .wd-link { margin-top:auto; }
.inlife-websites .wd-package > .wd-link { display:inline-flex; min-height:50px; padding:15px 23px; background:var(--inlife-action); color:#fff; border-radius:8px; text-decoration:none; }
.inlife-websites .wd-package .wd-small { margin-top:25px; font-size:clamp(12px,1vw,16px); }
.inlife-websites .wd-package-dark { border-color:transparent; background:linear-gradient(135deg,#21313c,#111b24); color:white; }
.inlife-websites .wd-package-dark :is(h3,.wd-copy,.wd-small,.inlife-eyebrow) { color:inherit; }.inlife-websites .wd-package-dark :is(.wd-copy,.wd-small,.inlife-eyebrow) { color:#bbc9d3; }
.inlife-websites .wd-package-dark .wd-checks > *::before { color:var(--inlife-mint); background:#304a4d; }
.inlife-websites .wd-guide { position:relative; padding:100px 0 135px; background:linear-gradient(#fff 40%,#f5f6f7 40%); isolation:isolate; }
.inlife-websites .wd-guide::before { content:''; z-index:-1; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 900' preserveAspectRatio='none'%3E%3Cpath fill='%23f13250' d='M0 90L1180 198C1380 223 1520 131 1600 18V729C1500 853 1340 920 1180 882L0 792Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; }
.inlife-websites .wd-guide-grid { display:grid; grid-template-columns:1fr 1fr; align-items:center; gap:7%; min-height:740px; }
.inlife-websites .wd-guide-copy { padding-top:90px; }
.inlife-websites .wd-guide-copy .inlife-heading { font-size:clamp(36px,3.6vw,58px); }.inlife-websites .wd-guide-copy .inlife-heading span { color:#fff; }
.inlife-websites .wd-guide-copy .inlife-eyebrow,.inlife-websites .wd-guide-copy .wd-copy { color:var(--inlife-ink); }
.inlife-websites .wd-guide-copy .wd-copy { margin-top:36px; }
.inlife-websites .wd-guide-labels { display:flex; flex-direction:row; justify-content:space-between; gap:15px; border-top:1px solid #ba2944; margin:36px 0 30px; padding-top:28px; font-size:clamp(8px,.67vw,11px); font-weight:800; letter-spacing:.1em; }
.inlife-websites .wd-guide-copy .wd-actions { gap:22px; font-size:15px; }.inlife-websites .wd-guide-copy .wd-link { color:var(--inlife-ink); white-space:nowrap; flex:0 0 auto; }
.inlife-websites .wd-guide-visual { position:relative; padding-top:325px; align-self:center; }
.inlife-websites .wd-brochure { position:absolute; width:82%; height:auto; top:-125px; left:9%; filter:drop-shadow(8px 20px 22px #17212b35); }
.inlife-websites .wd-guide-card { position:relative; z-index:1; background:#fff; padding:42px; border-radius:20px; box-shadow:var(--inlife-shadow); }
.inlife-websites .wd-guide-card h3 { font-size:clamp(24px,2vw,32px); font-weight:800; letter-spacing:-.04em; margin-bottom:21px; }
.inlife-websites .wd-guide-card .wd-copy { font-size:clamp(15px,1.25vw,20px); }
.inlife-websites .wd-guide-form { width:100%; margin:26px 0 17px; }
.inlife-websites .wd-guide-form .form-group { width:100%; padding:0; margin:0 0 22px; }
.inlife-websites .wd-guide-form label { font-size:16px; font-weight:700; margin-bottom:13px; display:block; }
.inlife-websites .wd-guide-form input[type=email] { width:100%; height:60px; padding:15px 17px; border:1px solid #b9c3ca; border-radius:8px; color:var(--inlife-ink); font-family:inherit; font-size:16px; background:#fff; }
.inlife-websites .wd-guide-form button[type=submit] { width:100%; min-height:55px; padding:15px 20px; border:0; border-radius:8px; background:var(--inlife-action); color:white; font-family:inherit; font-size:clamp(13px,1.15vw,18px); font-weight:700; cursor:pointer; }
.inlife-websites .wd-guide-form button[type=submit]:hover { background:#b71c39; }.inlife-websites .wd-guide-form button[type=submit]:disabled { opacity:.55; cursor:wait; }
.inlife-websites .wd-guide-form .message { font-size:15px; line-height:1.6; padding:17px; border-radius:8px; margin-top:16px; }.inlife-websites .wd-guide-form .message.success { background:#e3f4ed; color:#1a6b50; }.inlife-websites .wd-guide-form .message.error,.inlife-websites .wd-guide-form .message.danger { background:#ffebef; color:#a21634; }
.inlife-websites .wd-guide-privacy { font-size:12px; line-height:1.85; color:#74808a; }.inlife-websites .wd-guide-privacy a { text-decoration:underline; }
.inlife-websites .wd-guide-followup { margin:8px 0 22px; font-size:14px; }.inlife-websites [hidden] { display:none!important; }.inlife-websites .wd-guide-followup .wd-link { margin:12px 15px 0 0; font-size:13px; }
.inlife-websites .wd-guide-recipient { overflow-wrap:anywhere; }.inlife-websites .wd-guide-form.wd-sent .form-group { display:none; }
/* Client logos and the existing Google review feed. */
.inlife-websites .wd-people { padding-top:20px; }
.inlife-websites .wd-client-logos { display:grid; grid-template-columns:.8fr 1.1fr 1.1fr 1.3fr; align-items:center; gap:8%; margin:55px 0 48px; padding:0 25px 45px; border-bottom:1px solid #dce2e6; }
.inlife-websites .wd-client-logos img { width:100%; height:120px; object-fit:contain; filter:grayscale(1); opacity:.8; }
.inlife-websites .wd-client-logos img:first-child { max-width:115px; justify-self:center; }
.inlife-websites .wd-review-heading { display:flex; flex-direction:row; align-items:center; gap:26px; margin-bottom:35px; }
.inlife-websites .wd-review-title { display:flex; align-items:center; flex-direction:row; gap:17px; flex:1; }
.inlife-websites .wd-review-title img { width:27px; height:27px; }.inlife-websites .wd-review-title :is(h2,h3) { font-size:clamp(21px,1.65vw,26px); font-weight:800; letter-spacing:-.04em; }
.inlife-websites .wd-review-heading .wd-link { color:var(--inlife-ink); font-size:14px; white-space:nowrap; }
.inlife-websites .wd-review-heading .wd-round { width:44px; height:44px; flex-basis:44px; }.inlife-websites .wd-review-heading .wd-arrows { gap:12px; }
.inlife-websites .wd-reviews-widget { width:100%; }
.inlife-websites .wd-review-track { display:flex; gap:30px; width:100%; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; align-items:stretch; padding-bottom:10px; }.inlife-websites .wd-review-track::-webkit-scrollbar { display:none; }
.inlife-websites .wd-review { flex:0 0 calc((100% - 60px)/3); padding:30px; border:1px solid #dfe5e8; border-radius:19px; background:#fff; scroll-snap-align:start; }
.inlife-websites .wd-review-person { display:flex; align-items:center; gap:15px; margin-bottom:22px; }.inlife-websites .wd-review-person img,.inlife-websites .wd-review-initials { display:grid; place-items:center; width:43px; height:43px; flex:0 0 43px; border-radius:50%; object-fit:cover; background:#e8edf1; font-size:13px; font-weight:800; }
.inlife-websites .wd-review-name { display:block; font-size:16px; font-weight:750; }.inlife-websites .wd-review-date { display:block; font-size:12px; color:#7f8992; margin-top:5px; }
.inlife-websites .wd-review-stars { color:#f4b82c; font-size:21px; letter-spacing:3px; margin-bottom:16px; }
.inlife-websites .wd-review blockquote { font-family:inherit; padding:0; border:0; margin:0; font-size:clamp(17px,1.44vw,23px); line-height:1.45; font-weight:650; letter-spacing:-.02em; }
.inlife-websites .wd-review blockquote:not(.is-expanded) { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; }
.inlife-websites .wd-review-more { margin-top:20px; padding:0 0 4px; font:600 13px/1.4 inherit; font-family:inherit; font-size:13px; background:none; border:0; text-decoration:underline; text-underline-offset:5px; color:#687781; cursor:pointer; }
/* Process, local support, related services and questions. */
.inlife-websites .wd-process-grid { display:grid; grid-template-columns:1fr 1fr; gap:8%; margin-top:80px; align-items:center; }
.inlife-websites .wd-steps { position:relative; }.inlife-websites .wd-steps::before { content:''; position:absolute; left:21px; top:25px; bottom:50px; width:1px; background:#d5dfe4; }
.inlife-websites .wd-step { position:relative; display:flex; flex-direction:row; flex-wrap:nowrap; gap:23px; align-items:flex-start; margin-bottom:35px; }.inlife-websites .wd-step:last-child { margin-bottom:0; }
.inlife-websites .wd-step-number { display:grid; place-items:center; flex:0 0 43px; width:43px; height:43px; background:#fff; border:1px solid #cfd8de; border-radius:50%; font-size:11px; font-weight:700; }.inlife-websites .wd-step:first-child .wd-step-number { background:var(--inlife-red); border-color:var(--inlife-red); color:#fff; }
.inlife-websites .wd-step h3 { margin-bottom:10px; font-size:clamp(21px,1.75vw,28px); font-weight:750; letter-spacing:-.03em; }.inlife-websites .wd-step .wd-copy { font-size:clamp(14px,1.25vw,20px); }
.inlife-websites .wd-portal-browser { border-radius:15px; }.inlife-websites .wd-portal-browser .wd-browser-screen { aspect-ratio:1.16; object-position:left top; }
.inlife-websites .wd-portal-caption { position:relative; width:86%; margin:-45px auto 0; padding:27px 29px; background:#fff; border:1px solid #e5e9ec; border-radius:16px; box-shadow:var(--inlife-shadow); }
.inlife-websites .wd-portal-caption .inlife-eyebrow { font-size:9px; color:#72818d; }.inlife-websites .wd-portal-caption h3 { font-size:clamp(24px,1.9vw,30px); font-weight:800; letter-spacing:-.04em; }
.inlife-websites .wd-preview-note { margin-top:28px; text-align:right; font-size:8px; font-weight:700; letter-spacing:.18em; color:#7a8791; }
.inlife-websites .wd-connected { width:100%; padding:53px 0; background:var(--inlife-dark); color:white; }
.inlife-websites .wd-connected-row { display:grid; grid-template-columns:1fr .58fr; align-items:center; gap:60px; }.inlife-websites .wd-connected .inlife-heading { color:white; font-size:clamp(31px,2.65vw,42px); }
.inlife-websites .wd-connected .inlife-eyebrow,.inlife-websites .wd-connected .wd-copy { color:#b5c3cf; }.inlife-websites .wd-connected .wd-copy { margin-top:21px; font-size:clamp(16px,1.35vw,22px); }
.inlife-websites .wd-connected-links { display:grid; grid-template-columns:1fr 1fr; gap:25px; align-items:center; }.inlife-websites .wd-connected-links img { width:180px; height:78px; object-fit:contain; }.inlife-websites .wd-connected-links .wd-link { grid-column:1/-1; color:#fff; }
.inlife-websites .wd-local-grid { display:grid; grid-template-columns:1fr 1fr; gap:9%; align-items:center; }.inlife-websites .wd-local-copy .wd-copy { margin-top:43px; }.inlife-websites .wd-local-copy .wd-small { margin-top:32px; }.inlife-websites .wd-local-copy .wd-link { margin-top:35px; }
.inlife-websites .wd-local-photo { width:100%; aspect-ratio:1.48; object-fit:cover; border-radius:20px; }
.inlife-websites .wd-local-quote { font-family:"Plus Jakarta Sans",Arial,sans-serif; position:relative; width:86%; margin:-50px auto 0; padding:28px 32px; background:#fff; border:1px solid #e1e7ea; border-radius:18px; box-shadow:var(--inlife-shadow); }.inlife-websites .wd-local-quote .inlife-eyebrow { font-size:9px; margin-bottom:18px; }.inlife-websites .wd-quote { font-size:clamp(18px,1.37vw,22px); line-height:1.5; font-weight:700; letter-spacing:-.02em; }.inlife-websites .wd-local-quote .wd-small { font-size:12px; margin-top:20px; }
.inlife-websites .wd-faq-grid { display:grid; grid-template-columns:.65fr 1fr; gap:12%; }.inlife-websites .wd-faq-intro { align-self:start; position:sticky; top:120px; }.inlife-websites .wd-faq-intro .inlife-heading { font-size:clamp(36px,3.6vw,58px); }.inlife-websites .wd-faq-intro .wd-copy { max-width:340px; margin-top:45px; }.inlife-websites .wd-faq-intro .inlife-button { margin-top:36px; }.inlife-websites .wd-faq-intro .wd-small { margin-top:50px; }.inlife-websites .wd-phone-link { margin-top:15px; padding:0; background:none; color:var(--inlife-ink); font-size:24px; font-weight:750; }
.inlife-websites .wd-faq { border-bottom:1px solid #dbe2e6; }.inlife-websites .wd-faq-summary { position:relative; cursor:pointer; padding:24px 35px 24px 0; list-style:none; }.inlife-websites .wd-faq-summary::-webkit-details-marker { display:none; }.inlife-websites .wd-faq-summary h3 { font-size:clamp(18px,1.43vw,23px); font-weight:650; line-height:1.4; letter-spacing:-.02em; }.inlife-websites .wd-faq-summary::after { content:'+'; position:absolute; top:22px; right:0; font-size:25px; line-height:1; }.inlife-websites .wd-faq[open] > .wd-faq-summary::after { content:'−'; }.inlife-websites .wd-faq-summary:hover h3 { color:var(--inlife-action); }.inlife-websites .wd-faq-answer { padding:0 28px 27px 0; }.inlife-websites .wd-faq-answer .wd-copy { font-size:clamp(16px,1.35vw,22px); }.inlife-websites .wd-faq-answer .wd-link { margin-top:24px; }
/* Real design previews remain separate from the carousel controls. */
.inlife-websites .wd-design-dialog { position:fixed; inset:0; display:none; margin:auto; width:min(1100px,calc(100vw - 48px)); max-height:calc(100dvh - 48px); padding:0; border:0; border-radius:20px; background:#fff; overflow-y:auto; overscroll-behavior:contain; color:var(--inlife-ink); box-shadow:0 25px 90px #0005; }
.inlife-websites .wd-design-dialog[open] { display:block; animation:wd-dialog-in .25s ease both; }.inlife-websites .wd-design-dialog::backdrop { background:#08121acc; backdrop-filter:blur(5px); }
.inlife-websites .wd-dialog-head { position:relative; display:flex; flex-direction:row; gap:30px; justify-content:space-between; padding:28px 34px; }.inlife-websites .wd-dialog-head h2 { font-size:32px; font-weight:800; letter-spacing:-.04em; }.inlife-websites .wd-dialog-head .inlife-eyebrow { margin-bottom:10px; }.inlife-websites .wd-dialog-head .wd-copy { font-size:15px; margin-top:10px; }
.inlife-websites .wd-dialog-close { flex:0 0 42px; height:42px; border:1px solid #d2dbe1; border-radius:50%; background:#f4f6f7; color:var(--inlife-ink); padding:0; font-size:0; cursor:pointer; }.inlife-websites .wd-dialog-close::after { content:'×'; font:28px/1 Arial,sans-serif; }
.inlife-websites .wd-design-preview { width:100%; height:auto; }.inlife-websites .wd-dialog-foot { display:flex; flex-flow:row wrap; align-items:center; justify-content:space-between; gap:20px; padding:30px; }.inlife-websites .wd-dialog-foot .wd-copy { font-size:17px; }
@keyframes wd-dialog-in { from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none} }
@media(min-width:1600px) { .inlife-websites .wd-hero { padding-top:175px; } }
@media(max-width:1150px) {
 .inlife-websites .wd-space { padding:80px 0; }.inlife-websites .wd-section-head { gap:6%; }.inlife-websites .wd-hero-copy .wd-actions { gap:20px; }.inlife-websites .wd-hero-copy .inlife-button { padding-inline:18px; font-size:13px; }.inlife-websites .wd-hero-copy .wd-link { font-size:12px; }
 .inlife-websites .wd-title { font-size:6.2vw; }.inlife-websites .wd-hero-art { aspect-ratio:.85; }.inlife-websites .wd-hero-main { top:31%; }.inlife-websites .wd-phone { top:64%; }.inlife-websites .wd-hero-badge { top:84%; padding:17px 8px; }
 .inlife-websites .wd-benefit-grid { gap:36px; }.inlife-websites .wd-package { padding:30px; }.inlife-websites .wd-packages { gap:26px; }.inlife-websites .wd-guide-grid { gap:5%; min-height:700px; }.inlife-websites .wd-guide-card { padding:28px; }.inlife-websites .wd-guide-visual { padding-top:240px; }.inlife-websites .wd-brochure { top:-90px; width:96%; left:2%; }
 .inlife-websites .wd-project-track { --wd-gap:24px; }.inlife-websites .wd-project-media { padding:15px; }.inlife-websites .wd-project-info { grid-template-columns:1fr; gap:10px; }.inlife-websites .wd-project-info .wd-project-open { grid-row:3; justify-self:start; }.inlife-websites .wd-review { padding:22px; }.inlife-websites .wd-review-person { gap:10px; }.inlife-websites .wd-review-name { font-size:13px; }.inlife-websites .wd-review-date { font-size:10px; }.inlife-websites .wd-review-heading { gap:20px; }.inlife-websites .wd-review-heading .wd-link { font-size:12px; }
 .inlife-websites .wd-connected-row { grid-template-columns:1fr .7fr; gap:35px; }.inlife-websites .wd-connected-links .inlife-button { font-size:13px; padding-inline:17px; }
}
@media(max-width:800px) {
 .inlife-websites .wd-space { padding:65px 0; }.inlife-websites .inlife-heading { font-size:clamp(34px,5.8vw,46px); }.inlife-websites .wd-copy { font-size:17px; }.inlife-websites .inlife-eyebrow { font-size:10px; }
 .inlife-websites .wd-hero { padding:120px 0 100px; }.inlife-websites .wd-hero-grid { grid-template-columns:1fr; gap:42px; }.inlife-websites .wd-hero-copy { padding-bottom:0; }.inlife-websites .wd-title { font-size:clamp(47px,8vw,65px); }.inlife-websites .wd-hero-subtitle { margin-top:25px; font-size:24px; }.inlife-websites .wd-hero-copy .wd-copy { margin-top:23px; max-width:600px; }.inlife-websites .wd-hero-copy .wd-actions { margin-top:28px; gap:26px; }.inlife-websites .wd-hero-copy .wd-link { font-size:14px; }.inlife-websites .wd-signoff { font-size:12px; margin-top:30px; }
 .inlife-websites .wd-hero-art { width:94%; max-width:570px; aspect-ratio:1; margin:20px auto 30px; }.inlife-websites .wd-hero-main { top:26%; }.inlife-websites .wd-phone { top:72%; border-radius:21px; }.inlife-websites .wd-hero-badge { top:94%; font-size:8px; padding:17px 8px; }.inlife-websites .wd-hero::after { height:70px; }
 .inlife-websites .wd-section-head,.inlife-websites .wd-options .wd-section-head { grid-template-columns:1fr; gap:26px; }.inlife-websites .wd-section-intro { max-width:620px; }.inlife-websites .wd-benefit-grid { grid-template-columns:repeat(2,minmax(0,1fr)); margin-top:45px; gap:35px; }.inlife-websites .wd-benefit h3 { font-size:21px; }.inlife-websites .wd-benefit .wd-copy { font-size:16px; }
 .inlife-websites .wd-project-track { margin-top:40px; }.inlife-websites .wd-project-card { flex-basis:calc((100% - 24px)/1.55); }.inlife-websites .wd-project-info h3 { font-size:23px; }.inlife-websites .wd-project-info .wd-copy { font-size:15px; }.inlife-websites .wd-project-open { font-size:14px; }.inlife-websites .wd-carousel-controls { gap:25px; margin-top:30px; }
 .inlife-websites .wd-options .inlife-heading { font-size:clamp(33px,5.8vw,46px); }.inlife-websites .wd-packages { grid-template-columns:1fr; gap:30px; margin-top:40px; }.inlife-websites .wd-package { padding:35px; }.inlife-websites .wd-package h3 { font-size:34px; }.inlife-websites .wd-price strong { font-size:60px; }.inlife-websites .wd-price-terms { font-size:15px; }.inlife-websites .wd-checks > * { font-size:16px; }.inlife-websites .wd-package .wd-small { font-size:13px; }
 .inlife-websites .wd-guide { padding:70px 0 125px; }.inlife-websites .wd-guide::before { clip-path:none; inset:0; background:var(--inlife-red); mask:none; }.inlife-websites .wd-guide::after { content:''; position:absolute; bottom:-1px; left:0; width:100%; height:65px; background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1600 230' preserveAspectRatio='none'%3E%3Cpath fill='%23f5f6f7' d='M0 90L1180 217.833C1320 233 1490 170 1600 22V230H0Z'/%3E%3C/svg%3E") center/100% 100% no-repeat; }.inlife-websites .wd-guide-grid { grid-template-columns:1fr; gap:50px; }.inlife-websites .wd-guide-copy { padding-top:0; }.inlife-websites .wd-guide-copy .inlife-heading { font-size:clamp(37px,6vw,48px); }.inlife-websites .wd-guide-copy .wd-copy { margin-top:25px; }.inlife-websites .wd-guide-labels { font-size:10px; }.inlife-websites .wd-guide-visual { width:100%; max-width:580px; margin:auto; padding-top:350px; }.inlife-websites .wd-brochure { width:80%; top:-55px; left:10%; }.inlife-websites .wd-guide-card { padding:36px; }.inlife-websites .wd-guide-card h3 { font-size:29px; }.inlife-websites .wd-guide-card .wd-copy { font-size:16px; }.inlife-websites .wd-guide-form button[type=submit] { font-size:16px; }
 .inlife-websites .wd-client-logos { gap:6%; padding:0 0 30px; margin:40px 0; }.inlife-websites .wd-client-logos img { height:90px; }.inlife-websites .wd-client-logos img:first-child { max-width:90px; }.inlife-websites .wd-review-heading { flex-wrap:wrap; justify-content:space-between; gap:22px; }.inlife-websites .wd-review-title { flex:1 1 100%; }.inlife-websites .wd-review-heading .wd-link { font-size:14px; }.inlife-websites .wd-review-track { gap:20px; }.inlife-websites .wd-review { flex-basis:calc((100% - 20px)/1.65); padding:25px; }.inlife-websites .wd-review-name { font-size:15px; }.inlife-websites .wd-review-date { font-size:11px; }.inlife-websites .wd-review blockquote { font-size:19px; }
 .inlife-websites .wd-process-grid { grid-template-columns:1fr; gap:55px; margin-top:45px; }.inlife-websites .wd-step h3 { font-size:23px; }.inlife-websites .wd-step .wd-copy { font-size:16px; }.inlife-websites .wd-portal-visual { max-width:600px; margin:auto; }.inlife-websites .wd-portal-caption h3 { font-size:28px; }
 .inlife-websites .wd-connected-row { grid-template-columns:1fr; gap:36px; }.inlife-websites .wd-connected-links { max-width:400px; gap:20px; }.inlife-websites .wd-connected-links img { height:65px; }.inlife-websites .wd-connected-links .wd-link { font-size:16px; }.inlife-websites .wd-connected-links .inlife-button { font-size:15px; }
 .inlife-websites .wd-local-grid { grid-template-columns:1fr; gap:45px; }.inlife-websites .wd-local-copy .wd-copy { margin-top:27px; }.inlife-websites .wd-local-copy .wd-small { font-size:15px; }.inlife-websites .wd-local-copy .wd-link { font-size:16px; }.inlife-websites .wd-local-quote .wd-quote { font-size:21px; }
 .inlife-websites .wd-faq-grid { grid-template-columns:1fr; gap:42px; }.inlife-websites .wd-faq-intro { position:static; }.inlife-websites .wd-faq-intro .inlife-heading { font-size:42px; }.inlife-websites .wd-faq-intro .wd-copy { max-width:550px; margin-top:25px; }.inlife-websites .wd-faq-intro .wd-small { margin-top:25px; font-size:14px; }.inlife-websites .wd-faq-summary h3 { font-size:20px; }.inlife-websites .wd-faq-answer .wd-copy { font-size:17px; }.inlife-websites .wd-faq-answer .wd-link { font-size:14px; }
}
@media(max-width:500px) {
 .inlife-websites .wd-hero { padding-top:112px; padding-bottom:70px; }.inlife-websites .wd-title { font-size:clamp(39px,10.6vw,53px); }.inlife-websites .wd-hero-subtitle { font-size:20px; }.inlife-websites .wd-hero-copy .wd-copy { font-size:16px; }.inlife-websites .wd-signoff { font-size:10px; gap:10px; }.inlife-websites .wd-hero-copy .wd-actions { gap:20px; }.inlife-websites .wd-hero-copy .wd-link { font-size:12px; }.inlife-websites .wd-hero-copy .inlife-button { font-size:13px; padding:13px 15px; }.inlife-websites .wd-hero-art { width:96%; margin-top:5px; margin-bottom:25px; }.inlife-websites .wd-phone { padding:3px; border-width:1px; border-radius:14px; }.inlife-websites .wd-phone img { border-radius:10px; }.inlife-websites .wd-phone::after { top:5px; height:4px; }.inlife-websites .wd-browser { border-radius:8px; padding:0 3px 3px; }.inlife-websites .wd-browser-bar { height:16px; padding-left:4px; gap:3px; }.inlife-websites .wd-browser-bar i { width:3px; height:3px; flex-basis:3px; }.inlife-websites .wd-browser-bar span { top:4px; height:8px; font-size:4px; line-height:8px; }.inlife-websites .wd-hero-badge { border-radius:6px; padding:12px 5px; font-size:5px; }.inlife-websites .wd-hero-badge::before { width:5px; height:5px; margin-right:5px; }
 .inlife-websites .wd-space { padding:55px 0; }.inlife-websites .inlife-heading { font-size:33px; }.inlife-websites .wd-copy { font-size:16px; }.inlife-websites .wd-benefit-grid { grid-template-columns:1fr; gap:25px; margin-top:35px; }.inlife-websites .wd-number { margin-bottom:13px; }.inlife-websites .wd-benefit h3 { font-size:22px; }.inlife-websites .wd-benefit .wd-copy { font-size:16px; }
 .inlife-websites .wd-project-track { --wd-gap:20px; margin-top:30px; }.inlife-websites .wd-project-card { flex-basis:87%; }.inlife-websites .wd-project-info h3 { font-size:23px; }.inlife-websites .wd-project-media { padding:16px; }.inlife-websites .wd-project-open { font-size:14px; }.inlife-websites .wd-project-info .wd-copy { font-size:14px; }.inlife-websites .wd-carousel-controls { gap:17px; }.inlife-websites .wd-project-count { font-size:13px; width:59px; }.inlife-websites .wd-project-count strong { font-size:17px; }.inlife-websites .wd-arrows { gap:10px; }.inlife-websites .wd-round { width:44px; height:44px; flex-basis:44px; }.inlife-websites .wd-track-hint { font-size:11px; }
 .inlife-websites .wd-options .inlife-heading { font-size:32px; }.inlife-websites .wd-package { padding:28px 23px; }.inlife-websites .wd-package h3 { font-size:30px; }.inlife-websites .wd-price { gap:10px; font-size:16px; }.inlife-websites .wd-price strong { font-size:54px; }.inlife-websites .wd-price-terms { font-size:13px; }.inlife-websites .wd-checks { gap:16px; margin:28px 0; }.inlife-websites .wd-checks > * { gap:11px; font-size:14px; }.inlife-websites .wd-package .inlife-button { font-size:13px; }.inlife-websites .wd-package > .wd-link { font-size:14px; padding:13px 15px; }
 .inlife-websites .wd-guide { padding:60px 0 105px; }.inlife-websites .wd-guide-copy .inlife-heading { font-size:34px; }.inlife-websites .wd-guide-labels { flex-wrap:wrap; justify-content:flex-start; gap:18px; font-size:8px; }.inlife-websites .wd-guide-copy .wd-actions { gap:15px; font-size:13px; }.inlife-websites .wd-guide-copy .wd-link { font-size:13px; }.inlife-websites .wd-guide-grid { gap:40px; }.inlife-websites .wd-guide-visual { padding-top:68vw; }.inlife-websites .wd-brochure { width:94%; left:3%; top:-30px; }.inlife-websites .wd-guide-card { padding:27px 23px; border-radius:15px; }.inlife-websites .wd-guide-card h3 { font-size:25px; }.inlife-websites .wd-guide-card .wd-copy { font-size:15px; }.inlife-websites .wd-guide-form button[type=submit] { padding:13px; font-size:13px; }.inlife-websites .wd-guide-privacy { font-size:11px; }
 .inlife-websites .wd-client-logos { grid-template-columns:1fr 1fr; gap:28px 18%; padding-inline:15px; }.inlife-websites .wd-client-logos img { height:85px; }.inlife-websites .wd-client-logos img:first-child { max-width:85px; }.inlife-websites .wd-review-title :is(h2,h3) { font-size:23px; }.inlife-websites .wd-review-heading .wd-link { font-size:12px; }.inlife-websites .wd-review { flex-basis:92%; padding:25px; }.inlife-websites .wd-review-track { gap:16px; }.inlife-websites .wd-review-heading { gap:20px 10px; }.inlife-websites .wd-review-heading .wd-round { width:38px; height:38px; flex-basis:38px; }
 .inlife-websites .wd-step { gap:17px; margin-bottom:28px; }.inlife-websites .wd-step h3 { font-size:20px; }.inlife-websites .wd-step .wd-copy { font-size:15px; }.inlife-websites .wd-portal-caption { padding:23px; width:88%; margin-top:-25px; }.inlife-websites .wd-portal-caption h3 { font-size:23px; }.inlife-websites .wd-connected-links { gap:18px; }.inlife-websites .wd-connected-links img { width:145px; }.inlife-websites .wd-connected-links .inlife-button { font-size:12px; padding-inline:15px; }.inlife-websites .wd-connected .inlife-heading { font-size:30px; }
 .inlife-websites .wd-local-photo { aspect-ratio:1.25; }.inlife-websites .wd-local-quote { width:88%; padding:24px; margin-top:-36px; }.inlife-websites .wd-local-quote .wd-quote { font-size:18px; }.inlife-websites .wd-local-quote .wd-small { font-size:11px; }.inlife-websites .wd-faq-intro .inlife-heading { font-size:35px; }.inlife-websites .wd-faq-summary { padding-block:23px; }.inlife-websites .wd-faq-summary h3 { font-size:18px; }.inlife-websites .wd-faq-answer .wd-copy { font-size:16px; }
 .inlife-websites .wd-design-dialog { width:calc(100vw - 24px); max-height:calc(100dvh - 24px); border-radius:14px; }.inlife-websites .wd-dialog-head { padding:22px; gap:15px; }.inlife-websites .wd-dialog-head h2 { font-size:25px; }.inlife-websites .wd-dialog-head .wd-copy { font-size:13px; }.inlife-websites .wd-dialog-head .inlife-eyebrow { font-size:8px; }.inlife-websites .wd-dialog-close { flex-basis:34px; height:34px; }.inlife-websites .wd-dialog-foot { padding:22px; }.inlife-websites .wd-dialog-foot .wd-copy { font-size:15px; }
}
/* Mobile cards and links keep the whole tap target aligned with the content. */
@media(max-width:800px) {
 .inlife-websites .wd-project-card { position:relative; }
 .inlife-websites .wd-project-info { position:static; }
 .inlife-websites .wd-project-info .wd-project-open { position:absolute; inset:0; z-index:2; grid-area:auto; justify-self:stretch; width:100%; max-width:none; height:100%; min-height:0; margin:0; padding:0; border:0; border-radius:20px; font-size:0; color:transparent; background:transparent; text-decoration:none; transform:none; cursor:pointer; }
 .inlife-websites .wd-project-info .wd-project-open::after { display:none; }
 .inlife-websites .wd-project-info .wd-project-open:focus-visible { outline:3px solid var(--inlife-action); outline-offset:-3px; }
 .inlife-websites .wd-package > .wd-link,.inlife-websites .wd-package > .inlife-button { width:100%; max-width:none; align-self:stretch; justify-content:space-between; white-space:nowrap; gap:10px; padding-inline:15px; --inlife-arrow-size:20px; }
 .inlife-websites .wd-hero-copy .wd-actions { flex-direction:column; align-items:flex-start; }
 .inlife-websites .wd-hero-copy .wd-link,.inlife-websites .wd-section-intro > .wd-link,.inlife-websites .wd-local-copy > .wd-link,.inlife-websites .wd-faq-answer > .wd-link { width:max-content; max-width:100%; margin-inline:0; padding-inline:0; justify-content:flex-start; text-align:left; white-space:nowrap; flex-wrap:nowrap; --inlife-arrow-size:16px; }
 .inlife-websites .wd-faq-answer { padding-right:0; }
 .inlife-websites .wd-faq-answer > .wd-link { font-size:clamp(12px,3.6vw,14px); gap:8px; }
}
@media(prefers-reduced-motion:reduce) { .inlife-websites *, .inlife-websites *::before,.inlife-websites *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }

/* Portfolio refresh: crop within the existing device frames, never distort. */
.inlife-websites .wd-hero-art .wd-screen-slides {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 1.5;
  overflow: hidden;
  border-radius: 5px;
}
.inlife-websites .wd-hero-art .wd-screen-slides > img {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center top;
  opacity: 0;
  transition: opacity 1s ease;
}
.inlife-websites .wd-hero-art .wd-screen-slides > img.is-active { opacity: 1; }
.inlife-websites .wd-phone .wd-screen-slides { height: 100%; aspect-ratio: auto; border-radius: 17px; }
.inlife-websites .wd-project-presentation { aspect-ratio: 1.5; object-fit: cover; object-position: center top; }
@media (prefers-reduced-motion: reduce) {
  .inlife-websites .wd-hero-art .wd-screen-slides > img { transition: none; }
}

/* A consistent phone viewport: keep screenshot width and top, trim only below. */
.inlife-websites .wd-hero-art .wd-phone { aspect-ratio:auto; }
.inlife-websites .wd-hero-art .wd-phone .wd-screen-slides {
  position:relative; inset:auto; width:100%; height:auto; aspect-ratio:0.52;
  border-radius:14px; background:#320508; isolation:isolate;
}
.inlife-websites .wd-hero-art .wd-phone .wd-screen-slides > img {
  inset:0 auto auto 0; width:100%; height:auto; max-width:none;
  object-fit:contain; object-position:center top; border-radius:0;
  filter:contrast(1.025);
}
.inlife-websites .wd-hero-art .wd-phone .wd-screen-slides::after {
  content:''; position:absolute; inset:0; z-index:3; pointer-events:none;
  border-radius:inherit;
  box-shadow:inset 0 0 2px 1px #0006,inset 0 2px 6px #0005;
}
.inlife-websites .wd-hero-art .wd-phone::after { display:none; }
.inlife-websites .wd-project-track { touch-action:pan-y pinch-zoom; user-select:none; -webkit-user-select:none; }
.inlife-websites .wd-project-track img { -webkit-user-drag:none; }
.inlife-websites .wd-project-track.wd-dragging { scroll-behavior:auto!important; }
.inlife-websites .wd-project-track.wd-dragging * { cursor:grabbing!important; }
@media(max-width:600px) {
 .inlife-websites .wd-hero-art .wd-phone .wd-screen-slides { border-radius:10px; }
}

/* Centre the close icon geometrically, independently of font baselines. */
.inlife-websites .wd-dialog-close { position:relative; }
.inlife-websites .wd-dialog-close::after {
  content:''; position:absolute; left:50%; top:50%; width:16px; height:16px;
  margin:0; padding:0; transform:translate(-50%,-50%); background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 4 12 12M16 4 4 16' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
  mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='m4 4 12 12M16 4 4 16' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E") center/contain no-repeat;
}
.inlife-websites .wd-hero-art .wd-phone .wd-screen-slides:has(> img.is-active[src*="iris-phone"]) { background:#f2f1eb; }

/* Scroll-linked flyer lift uses frame-rate-independent easing in JavaScript. */
.inlife-websites .wd-brochure[data-scroll-flyer] {
  transform:translate3d(0,var(--wd-flyer-y,0px),0);
  transition:none;
}
.inlife-websites .wd-brochure.wd-flyer-active { will-change:transform; }
@media(prefers-reduced-motion:reduce) {
 .inlife-websites .wd-brochure[data-scroll-flyer] { transform:none; transition:none; will-change:auto; }
}

/* IRIS remains centred after removing the secondary AI link. */
.inlife-websites .wd-connected-links.wd-iris-centred { align-self:center; align-items:center; }

/* Shared package CTA: one size, typography and hover treatment per card group. */
.inlife-websites .wd-package > .inlife-button.wd-package-action {
  display:inline-flex; align-items:center; justify-content:space-between;
  width:min(100%,300px); max-width:100%; min-height:58px; padding:15px 20px;
  gap:28px; border:0; border-radius:9px; font-size:16px; line-height:1.3;
  font-weight:700; white-space:nowrap; text-decoration:none;
  color:#fff; background:var(--inlife-action); --inlife-arrow-size:26px;
  transition:transform .25s ease,background .25s ease,box-shadow .25s ease;
}
.inlife-websites .wd-package > .inlife-button.wd-package-action:hover {
  color:#fff; background:var(--wd-package-hover,#c92140); transform:translateY(-3px);
  box-shadow:0 14px 30px var(--wd-package-shadow,rgba(222,40,72,.22));
}
.inlife-social .wd-package > .inlife-button.wd-package-action {
  width:100%; --wd-package-hover:#096340; --wd-package-shadow:#087c5138;
}
.inlife-websites .wd-scroll-card[data-scroll-card] { translate:0 var(--wd-card-y,0px); }
.inlife-websites .wd-scroll-card.wd-card-active { will-change:translate; }
@media(max-width:800px) {
 .inlife-websites .wd-package > .inlife-button.wd-package-action { width:100%; padding-inline:15px; gap:10px; --inlife-arrow-size:20px; }
}
@media(max-width:600px) {
 .inlife-websites .wd-package > .inlife-button.wd-package-action { font-size:13px; }
}
@media(prefers-reduced-motion:reduce) {
 .inlife-websites .wd-scroll-card[data-scroll-card] { translate:none; will-change:auto; }
 .inlife-websites .wd-package > .inlife-button.wd-package-action { transition:none; }
}

/* Balance the project introduction beside its heading after removing the link. */
.inlife-websites .wd-portfolio .wd-section-head { align-items:center; }
