/* in-Pratica — Desktop-first CSS
Obiettivo: calma, autorevolezza, aria. No vibe SaaS.
*/
:root{
–bg: #f7f8f6;
–surface: #ffffff;
–surface-soft: #f1f3ef;
–border: #e2e6df;
–text: #1e2723;
–muted: #5f6b64;
–muted2:#7b877f;
–brand: #7bbf8a;
–brand-soft: #e4f1e8;
–brand-dark: #2f5d45;
–radius-xl: 22px;
–radius-lg: 18px;
–radius-md: 14px;
–shadow: 0 12px 30px rgba(0,0,0,.06);
–max: 1200px;
–content: 1040px;
–narrow: 840px;
–tight: 760px;
–gap: 24px;
–font: ui-sans-serif, system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial;
}
*{ box-sizing:border-box; }
html,body{ height:100%; }
body{
margin:0;
font-family: var(–font);
color: var(–text);
background: var(–bg);
line-height:1.45;
}
a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
.container{ width:min(var(–max), calc(100% – 48px)); margin:0 auto; }
.content{ width:min(var(–content), 100%); margin:0 auto; }
.narrow{ width:min(var(–narrow), 100%); margin:0 auto; }
.tight{ width:min(var(–tight), 100%); margin:0 auto; }
.stack{ display:flex; flex-direction:column; gap: var(–gap); }
.grid{ display:grid; gap: var(–gap); }
.muted{ color: var(–muted); }
.muted2{ color: var(–muted2); }
.hr-space{ height: 48px; }
.section{ padding: 96px 0; }
.section.sm{ padding: 72px 0; }
.section.lg{ padding: 112px 0; }
h1,h2,h3{ margin:0; letter-spacing:-.4px; }
h1{
font-size: clamp(36px, 4vw, 52px);
line-height: 1.05;
letter-spacing: -.9px;
}
h2{
font-size: 28px;
letter-spacing: -.5px;
}
h3{
font-size: 17px;
letter-spacing: -.2px;
}
p{ margin:0; }
.btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:10px;
height: 46px;
padding: 0 18px;
border-radius: 14px;
border: 1px solid var(–border);
background: var(–surface);
color: var(–text);
font-weight: 600;
font-size: 14px;
cursor: pointer;
}
.btn:hover{ filter: brightness(0.98); }
.btn:active{ transform: translateY(1px); }
.btn.primary{
background: var(–brand);
border-color: var(–brand);
color: #fff;
}
.btn.outline{
background: transparent;
border-color: var(–border);
}
.badge{
display:inline-block;
font-size:12px;
font-weight:500;
letter-spacing: .08em;
text-transform: uppercase;
color: var(–muted);
}
.card{
background: var(–surface);
border: 1px solid var(–border);
border-radius: var(–radius-xl);
box-shadow: none;
}
.card.pad{ padding: 32px; }
header{
position: sticky;
top:0;
z-index: 50;
background: rgba(247,248,246,.88);
backdrop-filter: blur(8px);
border-bottom: 1px solid var(–border);
}
.nav{
display:flex;
align-items:center;
justify-content: space-between;
height: 76px;
}
.brand{
display:flex;
align-items:center;
gap: 12px;
}
.logo{
width: 42px;
height: 42px;
border-radius: 14px;
overflow:hidden;
border: 1px solid var(–border);
background: var(–surface);
}
.brand strong{
font-size: 18px;
letter-spacing: -.3px;
}
.navlinks{
display:flex;
gap: 18px;
font-size: 14px;
color: var(–muted);
}
.navlinks a:hover{ color: var(–text); }
.hero{
padding: 112px 0 88px;
}
.hero .content{
text-align: center;
}
.hero p{
max-width: 60ch;
margin: 18px auto 0;
font-size: 16px;
color: var(–muted);
}
.hero .cta{
display:flex;
justify-content:center;
gap: 12px;
margin-top: 28px;
}
.micro{
margin-top: 12px;
font-size: 13px;
color: var(–muted2);
}
.problem p{
max-width: 70ch;
margin-top: 14px;
color: var(–muted);
font-size: 15px;
}
.bullets{
margin-top: 22px;
display:flex;
flex-direction:column;
gap: 10px;
color: var(–muted);
font-size: 15px;
}
.bullets span{ display:block; }
.three{
grid-template-columns: repeat(3, 1fr);
gap: 48px;
}
.feature p{
margin-top: 10px;
color: var(–muted);
font-size: 14px;
}
.video-block{
background: var(–surface-soft);
}
.video-wrap{
margin-top: 22px;
border-radius: var(–radius-xl);
overflow:hidden;
border: 1px solid var(–border);
background: #000;
aspect-ratio: 16 / 9;
box-shadow: var(–shadow);
}
.video-wrap iframe,
.video-wrap video{
width:100%;
height:100%;
border:0;
display:block;
}
.steps{
grid-template-columns: repeat(3, 1fr);
gap: 40px;
}
.step p{
margin-top: 10px;
color: var(–muted);
font-size: 14px;
}
.narrow-list{
margin-top: 18px;
display:flex;
flex-direction:column;
gap: 10px;
color: var(–muted);
font-size: 15px;
}
.about p{
margin-top: 14px;
color: var(–muted);
max-width: 75ch;
}
.about strong{
font-weight: 700;
}
.final-cta{
text-align:center;
}
.final-cta p{
margin-top: 16px;
color: var(–muted);
font-size: 15px;
}
.final-cta .cta{
margin-top: 22px;
}
.pricing-hero{
padding: 104px 0 64px;
text-align:center;
}
.pricing-hero p{
margin: 16px auto 0;
color: var(–muted);
font-size: 16px;
max-width: 58ch;
}
.premessa{
padding: 0 0 72px;
}
.premessa .tight{
color: var(–muted);
font-size: 15px;
}
.premessa h2{ margin-bottom: 12px; }
.pricing{
padding: 0 0 48px;
}
.pricing-grid{
grid-template-columns: repeat(3, 1fr);
gap: 36px;
align-items: stretch;
}
.plan{
padding: 36px;
border-radius: var(–radius-xl);
background: var(–surface);
border: 1px solid var(–border);
}
.plan.recommended{
background: var(–brand-soft);
border-color: rgba(123,191,138,.55);
}
.plan-title{
margin-top: 10px;
font-size: 24px;
font-weight: 600;
letter-spacing: -.3px;
}
.plan-desc{
margin-top: 12px;
color: var(–muted);
font-size: 15px;
line-height: 1.5;
min-height: 48px; /* aiuta l’allineamento */
}
.plan-list{
margin-top: 32px;
display:flex;
flex-direction:column;
gap: 10px;
color: var(–muted);
font-size: 14px;
line-height: 1.6;
}
.plan-price{
margin-top: 32px;
}
.plan-price .monthly{
font-size: 22px;
font-weight: 600;
letter-spacing: -.2px;
}
.plan-price .yearly{
margin-top: 4px;
font-size: 14px;
color: var(–muted2);
}
.plan .btn{
width: 100%;
margin-top: 22px;
}
.reassure{
padding: 0 0 88px;
text-align:center;
}
.reassure p{
max-width: 70ch;
margin: 0 auto;
font-size: 14px;
color: var(–muted2);
line-height: 1.55;
}
.faq{
padding: 0 0 80px;
}
.faq-grid{
grid-template-columns: repeat(2, 1fr);
gap: 28px 40px;
}
.faq-item{
background: var(–surface);
border: 1px solid var(–border);
border-radius: var(–radius-lg);
padding: 18px 20px;
}
.faq-item b{
display:block;
font-size: 14px;
margin-bottom: 8px;
}
.faq-item span{
color: var(–muted);
font-size: 14px;
line-height: 1.55;
}
footer{
border-top: 1px solid var(–border);
background: var(–surface);
padding: 40px 0;
color: var(–muted);
font-size: 13px;
}
/* Responsività minima (poi faremo tablet/smartphone come step separato) */
@media (max-width: 1024px){
.three, .steps, .pricing-grid, .faq-grid{ grid-template-columns: 1fr; }
.navlinks{ display:none; }
.hero{ padding: 96px 0 72px; }
.section{ padding: 80px 0; }
.plan{ padding: 28px; }
}
Trasformiamo ciò che sai in ciò che fai
Uno spazio di lavoro clinico per psicologi e psicoterapeuti
nei primi anni di professione.
Quando la teoria non basta più
All’inizio della professione clinica non manca lo studio.
Manca come stare dentro la seduta.
– Il confronto con colleghi è raro e disorganizzato
– La supervisione è essenziale, ma spesso difficile da sostenere
– La solitudine operativa rallenta la crescita
La risposta è uno spazio di lavoro
Video Tool pratici
Strumenti brevi, costruiti su problemi reali di seduta.
Non teoria, ma posizioni cliniche abitabili.
Supervisioni cliniche
In piccoli gruppi, con terapeuti senior.
Continuità, confronto reale, spazio per il dubbio.
Community professionale
Uno spazio protetto tra colleghi.
Per non lavorare più da soli.
Come si lavora in-Pratica
Video Tool, supervisioni e community. Senza rumore.
Un percorso semplice, nel tempo
Osservi
Guardi Video Tool costruiti su situazioni cliniche reali.
Ti confronti
Partecipi alle supervisioni e agli spazi di confronto.
Costruisci continuità
Dai forma al tuo modo di stare in seduta.
Per chi è in-Pratica
Non è pensata per chi cerca scorciatoie o soluzioni standard.
Chi guida lo spazio
in-Pratica è guidata da psicoterapeuti con lunga esperienza clinica e formativa,
abituati a lavorare nella complessità reale della seduta.
Non è una scuola.
È uno spazio di lavoro clinico condiviso.
Costruire sicurezza clinica richiede tempo,
ma non deve essere un percorso solitario.
Accedi a in-Pratica
Scegli il livello di supporto più adatto
al tuo momento professionale.
Prima di scegliere
in-Pratica non è un corso da completare
e non è un percorso a livelli.
È uno spazio di lavoro clinico continuativo.
I piani non indicano quanto sei competente,
ma di quanto supporto hai bisogno oggi.
Uno spazio essenziale per fare ordine e iniziare a costruire continuità.
È il piano che accompagna davvero la crescita quotidiana.
Non per chi è “indietro”, ma per chi vuole consolidare prima e meglio.
I piani indicano l’intensità del supporto, non il livello di competenza.
Puoi cambiare piano in qualsiasi momento.
Sì. Il tuo percorso può evolvere e il piano può evolvere con te.
No. in-Pratica è pensata anche per psicologi nei primi anni di lavoro clinico.
No. Affianca la pratica clinica reale, non la sostituisce.
Costruire sicurezza clinica richiede tempo,
ma non deve essere un percorso solitario.
Accedi a in-Pratica
Scegli il livello di supporto più adatto
al tuo momento professionale.
Prima di scegliere
in-Pratica non è un corso da completare
e non è un percorso a livelli.
È uno spazio di lavoro clinico continuativo.
I piani non indicano quanto sei competente,
ma di quanto supporto hai bisogno oggi.
Uno spazio essenziale per fare ordine e iniziare a costruire continuità.
È il piano che accompagna davvero la crescita quotidiana.
Non per chi è “indietro”, ma per chi vuole consolidare prima e meglio.
I piani indicano l’intensità del supporto, non il livello di competenza.
Puoi cambiare piano in qualsiasi momento.
Sì. Il tuo percorso può evolvere e il piano può evolvere con te.
No. in-Pratica è pensata anche per psicologi nei primi anni di lavoro clinico.
No. Affianca la pratica clinica reale, non la sostituisce.
Costruire sicurezza clinica richiede tempo,
ma non deve essere un percorso solitario.